.head-web{background-image:url(../img/web.jpg);background-position:center 55%}
.head-web .wrap{padding-block:56px 60px}
.head-web .btn{margin-top:18px}
.plans-sec{padding-block:40px 10px;display:grid;gap:18px}
.sec-top{display:flex;justify-content:space-between;align-items:end;gap:12px 24px;flex-wrap:wrap}
.sec-top h2,.how h2,.examples h2,.contact h2,.faq h2{font-family:var(--display);font-weight:400;font-size:clamp(28px,3.4vw,38px);margin:0}
.cur{min-width:240px}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
@media (max-width:900px){.plans{grid-template-columns:minmax(0,1fr)}}
.plan{background:var(--card);border-radius:12px;padding:24px;display:grid;grid-template-rows:auto auto auto auto 1fr auto auto;gap:12px;box-shadow:0 1px 0 var(--line),0 8px 24px rgba(60,40,20,.06);min-width:0}
.plan.featured{outline:2px solid var(--wine);box-shadow:0 12px 30px rgba(140,22,33,.15)}
.plan .tag{justify-self:start;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--sand);color:var(--muted);border-radius:999px;padding:4px 10px}
.plan.featured .tag{background:var(--wine);color:#fff}
.plan h3,.host h3{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.1;margin:0}
.plan p,.host p{margin:0;color:#3d3833}
.price{display:grid;gap:0}
.price .from{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.price b{font-family:var(--display);font-weight:400;font-size:40px;line-height:1.05;color:var(--wine)}
.price .conv{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;min-height:1.2em}
.price .per{font-size:15px;color:var(--muted)}
.plan ul{margin:0;padding-left:20px;display:grid;gap:6px;font-size:15.5px}
.plan .time{font-size:14px;color:var(--muted)}
.plan .btn{justify-self:stretch}
.host{display:flex;justify-content:space-between;align-items:center;gap:16px 30px;flex-wrap:wrap;background:var(--char);color:var(--on-dark);border-radius:12px;padding:22px 26px}
.host p{color:#e6ddd0;max-width:60ch;margin-top:6px}
.host .price b{color:#fff}.host .price .from,.host .price .per,.host .price .conv{color:#cfc6ba}
.rate-note{font-size:13.5px}
.how{padding-block:46px 10px;display:grid;gap:10px}
.steps{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:s}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.steps{grid-template-columns:minmax(0,1fr)}}
.steps li{background:var(--card);border-radius:12px;padding:18px;display:grid;gap:6px;align-content:start;border-top:4px solid var(--wine);box-shadow:0 1px 0 var(--line)}
.steps .pct{font-family:var(--display);font-size:30px;color:var(--wine);line-height:1}
.steps h3{font-size:18px;margin:0}
.steps p{margin:0;color:#3d3833;font-size:15.5px}
.examples{padding-block:46px 10px;display:grid;gap:16px}
.exs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.exs{grid-template-columns:minmax(0,1fr)}}
.ex{background:var(--card);border-radius:12px;padding:16px;display:grid;gap:8px;text-decoration:none;color:inherit;box-shadow:0 1px 0 var(--line)}
.ex:hover{box-shadow:0 1px 0 var(--line),0 10px 26px rgba(60,40,20,.1)}
.mock{display:grid;grid-template-rows:14px 1fr 22px;gap:6px;aspect-ratio:16/9;max-width:100%;background:var(--b);border-radius:8px;padding:10px}
.mock i{display:block;border-radius:4px;background:rgba(255,255,255,.2)}
.mock i:nth-child(2){background:linear-gradient(90deg,var(--a) 0 45%,rgba(255,255,255,.12) 45%)}
.mock i:nth-child(3){width:40%;background:var(--a)}
.ex h3{font-family:var(--display);font-weight:400;font-size:22px;margin:4px 0 0}
.ex p{margin:0;color:#3d3833;font-size:15.5px}
.ex .lnk{color:var(--wine);font-weight:600;font-size:15px}
.contact{margin-top:46px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:28px;background:var(--card);border-radius:14px;padding:28px;box-shadow:0 1px 0 var(--line)}
@media (max-width:820px){.contact{grid-template-columns:minmax(0,1fr)}}
.contact p{color:#3d3833}
.ct-form{display:grid;gap:12px}
.ct-form textarea{resize:vertical}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
.mail{user-select:all;font-weight:600}
.faq{padding-top:40px}
.head-legal .wrap{padding-block:40px 44px}
.legal{max-width:74ch;padding-block:34px 10px}
.legal h3{font-family:var(--display);font-weight:400;font-size:24px;margin:26px 0 6px}
.legal table{width:100%;border-collapse:collapse;font-size:15px;background:var(--card);border-radius:10px;overflow:hidden}
.legal th,.legal td{text-align:left;vertical-align:top;padding:9px 12px;border-bottom:1px solid var(--line)}
.legal th{background:var(--sand)}
.legal .tbl{overflow-x:auto}
.legal-next{margin-top:28px;padding-top:16px;border-top:1px solid var(--line);font-weight:600}
.free{display:flex;justify-content:space-between;align-items:center;gap:14px 28px;flex-wrap:wrap;border:2px dashed var(--wine);border-radius:12px;padding:20px 24px;background:#fff8f3}
.free h3{font-family:var(--display);font-weight:400;font-size:26px;margin:0;color:var(--wine)}
.free p{margin:6px 0 0;color:#3d3833;max-width:62ch}