:root{
--petrol:#03354e; --deep:#1e333d; --paper:#edf2f4; --white:#ffffff; --ice:#cfe2ea;
--ink:#0e2732; --text:#2a3e48; --muted:#53666f; --on-dark:#e8f0f3; --on-dark-2:#c3d5dd;
--bg:var(--paper); --surface:var(--white); --accent:var(--petrol); --accent-ink:#fff;
--display:"Michroma","Montserrat",Arial,sans-serif;
--body:"Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
--step-small:clamp(.8125rem,.79rem + .1vw,.875rem);
--step-body:clamp(1.0625rem,1rem + .25vw,1.1875rem);
--step-lead:clamp(1.25rem,1.1rem + .7vw,1.625rem);
--step-head:clamp(1.75rem,1.1rem + 2.6vw,3.5rem);
--step-display:clamp(2rem,.9rem + 4.4vw,4.75rem);
--margin:clamp(1rem,2.2vw,2rem);
--gutter:clamp(.75rem,1.4vw,1.5rem);
--axis:42%;
--gap-section:clamp(5rem,3rem + 8vw,12rem);
--ease-out:cubic-bezier(.22,1,.36,1);
--ease-in-out:cubic-bezier(.76,0,.24,1);
--ease-soft:cubic-bezier(.33,1,.68,1);
--t-press:140ms; --t-hover:180ms; --t-reveal:800ms;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--step-body)/1.55 var(--body);font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4,p,ul,ol,dl,dd,blockquote,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration-thickness:.07em;text-underline-offset:.18em}
::selection{background:var(--petrol);color:#fff}
:focus-visible{outline:3px solid var(--petrol);outline-offset:3px}
.field-petrol :focus-visible,.field-deep :focus-visible,.field-ink :focus-visible{outline-color:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:20;background:var(--ink);color:#fff;padding:10px 16px;font-weight:600}
.skip:focus{top:12px}
.tab{font-variant-numeric:tabular-nums}
.display{font-family:var(--display);font-weight:400;font-size:var(--step-display);line-height:1.04;letter-spacing:-.03em;text-wrap:balance;hyphens:none}
.head{font-family:var(--display);font-weight:400;font-size:var(--step-head);line-height:1.1;letter-spacing:-.025em;text-wrap:balance;hyphens:none}
.lead{font-size:var(--step-lead);line-height:1.38}
.small{font-size:var(--step-small);line-height:1.45}
.muted{color:var(--muted)}
p{text-wrap:pretty}
.field-paper{background:var(--paper);color:var(--ink)}
.field-white{background:var(--white);color:var(--ink)}
.field-ice{background:var(--ice);color:var(--ink)}
.field-petrol{background:var(--petrol);color:#fff;--muted:var(--on-dark-2)}
.field-deep{background:var(--deep);color:var(--on-dark);--muted:var(--on-dark-2)}
.field-ink{background:var(--ink);color:var(--on-dark);--muted:var(--on-dark-2)}
.wrap{padding-inline:var(--margin)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
.sec{padding-block:var(--gap-section)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border-radius:999px;border:0;background:var(--petrol);color:#fff;font:600 1rem/1.2 var(--body);text-decoration:none;cursor:pointer;touch-action:manipulation;transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease}
.btn:hover{background:var(--ink)}
.btn:active{transform:scale(.97)}
.btn svg{width:20px;height:20px;flex:none}
.field-petrol .btn,.field-deep .btn,.field-ink .btn,.tile-ink .btn{background:#fff;color:var(--petrol)}
.field-petrol .btn:hover,.field-deep .btn:hover,.field-ink .btn:hover,.tile-ink .btn:hover{background:var(--ice)}
.link{font-weight:600;text-decoration:underline;transition:color var(--t-hover) ease}
.link:hover{color:var(--petrol)}
.field-petrol .link:hover,.field-deep .link:hover,.field-ink .link:hover{color:var(--ice)}
.board{display:grid;gap:8px;padding:8px;height:100svh;min-height:680px;grid-template-rows:60px minmax(0,1.15fr) minmax(0,1fr);grid-template-columns:repeat(4,minmax(0,1fr));background:var(--paper)}
.tile{position:relative;overflow:hidden;background:var(--white);color:var(--ink);padding:24px}
.tile-ink{background:var(--petrol);color:#fff}
.tile-deep{background:var(--deep);color:var(--on-dark)}
.tile-ice{background:var(--ice);color:var(--ink)}
.tile-paper{background:var(--white)}
.bar{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:8px}
.bar>*{display:flex;align-items:center;padding:0 20px}
.bar .mark{background:var(--petrol);color:#fff;font-family:var(--display);font-size:var(--step-small);letter-spacing:.06em;text-decoration:none}
.bar nav{background:var(--white)}
.bar nav ul{display:flex;gap:28px;margin-left:calc(50% - 120px)}
.bar nav a{font-size:var(--step-small);font-weight:500;text-decoration:none}
.bar nav a:hover{text-decoration:underline}
.bar .act{background:var(--petrol);padding:0 8px}
.bar .act .btn{min-height:44px;padding:10px 20px;background:#fff;color:var(--petrol)}
.t-title{grid-column:1/3;display:flex;flex-direction:column;justify-content:flex-end;gap:20px}
.t-title .display{font-size:clamp(2rem,.6rem + 3.6vw,3.75rem);line-height:1.08}
.t-title p{max-width:44ch;color:var(--text)}
.t-ad{grid-column:3/5;background:var(--ice);display:grid;place-items:center;padding:24px}
.t-wa{grid-column:1/3;background:var(--deep);display:grid;place-items:center;padding:24px}
.t-say{grid-column:3/4;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.t-say p{font-size:var(--step-lead);line-height:1.3}
.t-go{grid-column:4/5;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.t-go p{line-height:1.4}
.t-go .price{font-family:var(--display);font-size:clamp(1.75rem,.8rem + 2.2vw,2.75rem);letter-spacing:-.02em;line-height:1}
.cap{font-size:var(--step-small);color:inherit;opacity:.8}
[data-ui]{font-family:var(--body);color:#111b21}
[data-ui].ad{width:min(100%,360px);background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(14,39,50,.12)}
[data-ui].ad .hd{display:flex;align-items:center;gap:10px;padding:10px 12px}
[data-ui].ad .av{width:30px;height:30px;border-radius:50%;background:var(--petrol)}
[data-ui].ad .nm{font-size:13px;font-weight:600;line-height:1.2}
[data-ui].ad .sp{display:block;font-size:12px;font-weight:400;color:#65676b}
[data-ui].ad .img{aspect-ratio:16/10;background:var(--petrol);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:22px}
[data-ui].ad .img b{font-family:var(--display);font-weight:400;font-size:clamp(18px,1.6vw,26px);line-height:1.15;letter-spacing:-.02em}
[data-ui].ad .img span{font-size:13px;color:var(--on-dark-2)}
[data-ui].ad .cta{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;font-size:13px;font-weight:600;background:#f0f2f5;border-radius:0 0 10px 10px}
[data-ui].ad .cta i{font-style:normal;background:#e4e6eb;border-radius:6px;padding:6px 10px}
[data-ui].wa{width:min(100%,420px);border-radius:10px;overflow:hidden;background:#efeae2;box-shadow:0 1px 2px rgba(0,0,0,.2)}
[data-ui].wa .hd{background:#008069;color:#fff;display:flex;align-items:center;gap:10px;padding:10px 14px;font-size:14px;font-weight:600}
[data-ui].wa .hd .av{width:30px;height:30px;border-radius:50%;background:#dfe5e7}
[data-ui].wa .hd small{display:block;font-weight:400;font-size:12px;opacity:.85}
[data-ui].wa .body{padding:14px;display:grid;gap:8px}
[data-ui].wa .tag{justify-self:center;background:#fff;color:#54656f;font-size:12px;padding:4px 10px;border-radius:7px}
[data-ui].wa .msg{max-width:85%;background:#fff;border-radius:8px;padding:8px 10px 6px;font-size:14.5px;line-height:1.35}
[data-ui].wa .msg.me{justify-self:end;background:#d9fdd3}
[data-ui].wa .msg time{display:block;text-align:right;font-size:11px;color:#4a5961;margin-top:2px}
[data-ui].pg{width:min(100%,300px);background:#fff;border-radius:22px;padding:10px;box-shadow:0 1px 2px rgba(14,39,50,.15)}
[data-ui].pg .scr{border-radius:14px;overflow:hidden;border:1px solid #e3eaee}
[data-ui].pg .top{background:var(--petrol);color:#fff;padding:22px 18px 26px}
[data-ui].pg .top b{display:block;font-family:var(--display);font-weight:400;font-size:19px;line-height:1.15;letter-spacing:-.02em}
[data-ui].pg .top span{display:block;margin-top:10px;font-size:12.5px;line-height:1.45;color:var(--on-dark-2)}
[data-ui].pg ul{padding:14px 18px;display:grid;gap:8px;font-size:12.5px;color:#2a3e48}
[data-ui].pg li::before{content:"";display:inline-block;width:7px;height:7px;border-radius:2px;background:var(--petrol);margin-right:8px;vertical-align:1px}
[data-ui].pg .b{margin:0 18px 18px;background:#008069;color:#fff;border-radius:999px;text-align:center;padding:11px;font-size:13px;font-weight:600}
[data-ui].thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;width:100%;min-width:300px;background:#fff;padding:10px;border-radius:8px}
[data-ui].thumbs p{grid-column:1/-1;font-family:var(--body);font-size:12.5px;color:#2a3e48;padding:8px 2px 2px;display:grid;gap:6px}
[data-ui].thumbs p span{display:flex;justify-content:space-between;border-top:1px solid #e3eaee;padding-top:6px}
[data-ui].thumbs div{aspect-ratio:4/5;border-radius:6px;padding:10px;display:flex;align-items:flex-end;font-family:var(--display);font-size:10.5px;line-height:1.2;letter-spacing:-.01em}
[data-ui].thumbs div:nth-child(1){background:var(--petrol);color:#fff}
[data-ui].thumbs div:nth-child(2){background:var(--ice);color:var(--ink)}
[data-ui].thumbs div:nth-child(3){background:var(--deep);color:#fff}
[data-ui].thumbs div:nth-child(4){background:#fff;color:var(--ink)}
[data-ui].thumbs div:nth-child(5){background:var(--ink);color:#fff}
[data-ui].sheet{width:100%;min-width:300px;background:#fff;border-radius:8px;overflow:hidden;font-size:12.5px;box-shadow:0 1px 2px rgba(14,39,50,.15)}
[data-ui].sheet table{width:100%;border-collapse:collapse}
[data-ui].sheet th,[data-ui].sheet td{border:1px solid #e1e6e9;padding:7px 8px;text-align:left;font-weight:400;white-space:nowrap}
[data-ui].sheet th{background:#f3f6f7;color:#53666f;font-weight:600}
[data-ui].sheet td.f{color:#0b57d0}
[data-ui].sheet .sel{outline:2px solid #0b57d0;outline-offset:-2px}
[data-ui].src{width:100%;min-width:300px;background:#fff;border-radius:8px;font-size:13px;box-shadow:0 1px 2px rgba(14,39,50,.15)}
[data-ui].src div{display:grid;grid-template-columns:1fr auto;gap:12px;padding:10px 14px;border-top:1px solid #e9eef1}
[data-ui].src div:first-child{border-top:0;color:#53666f;font-weight:600}
[data-ui].src em{font-style:normal;background:var(--ice);color:var(--petrol);border-radius:4px;padding:1px 7px;font-weight:600}
[data-ui].post{width:min(100%,320px);background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(14,39,50,.12);font-size:13px}
[data-ui].post .img{aspect-ratio:1/1;background:var(--ice);display:flex;align-items:flex-end;padding:16px;font-family:var(--display);font-size:15px;line-height:1.2;color:var(--ink)}
[data-ui].post .ft{padding:10px 12px;display:flex;justify-content:space-between;color:#2a3e48}
[data-ui].post .ft b{font-weight:600}
.intro{padding-block:clamp(6rem,4rem + 6vw,10rem)}
.intro .grid{align-items:start}
.intro .stmt{grid-column:7/13;font-size:clamp(1.375rem,1rem + 1.2vw,2.125rem);line-height:1.28;text-indent:3em;max-width:26ch}
.intro .fig{grid-column:1/5;grid-row:2;margin-top:-2rem}
.intro .note{grid-column:7/11;grid-row:2;margin-top:3rem;max-width:42ch}
.intro .note b{font-weight:600}
.how .top{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
.how .top h2{grid-column:1/6}
.how .top p{grid-column:7/12;max-width:46ch;align-self:end}
.how .diagram{margin-top:clamp(2.5rem,1rem + 4vw,5rem)}
.how .diagram svg{width:100%;height:auto}
.how .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gutter);margin-top:2rem}
.how .steps b{display:block;font-size:var(--step-lead);font-weight:600;margin-bottom:.5rem}
.how .steps p{max-width:34ch;color:var(--text)}
.how .steps .also{margin-top:.75rem;font-size:var(--step-small);color:var(--muted)}
.feat .grid{align-items:start}
.feat h2{grid-column:1/6;position:sticky;top:32px;line-height:1.06;max-width:9ch}
.feat .blocks{grid-column:6/13;display:grid;gap:clamp(3rem,2rem + 2vw,4rem)}
.feat article h3{font-size:var(--step-lead);font-weight:600;line-height:1.25;margin-bottom:1rem;max-width:24ch}
.feat .row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--gutter);align-items:start}
.feat .row.flip{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.feat .row.flip>.ui-wrap{order:2}
.feat .ui-wrap{display:flex;justify-content:center;padding:12px;background:rgba(255,255,255,.07)}
.feat ul.lines{display:grid;gap:.85rem;line-height:1.45}
.feat ul.lines li{max-width:34ch}
.feat .bonus{grid-column:1/-1;margin-top:clamp(4rem,2rem + 4vw,6rem);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
.feat .bonus h3{grid-column:1/6;margin-bottom:1rem}
.feat .bonus dl{grid-column:6/13;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gutter)!important}
.feat .bonus dl{display:grid;gap:1.25rem}
.feat .bonus dt{font-weight:600}
.feat .bonus dd{color:var(--muted);max-width:44ch}
.about .r1,.about .r2{display:grid;grid-template-columns:var(--axis-px,30%) minmax(0,1fr);column-gap:var(--gutter)}
.about .r2{margin-top:clamp(4rem,2rem + 5vw,7.5rem)}
.about .side{display:grid;gap:1.25rem;align-content:start}
.about .side img{width:min(100%,220px);height:auto;aspect-ratio:4/5;object-fit:cover}
.about .side dl{display:grid;gap:1rem}
.about .side dt{font-size:var(--step-small);color:var(--muted)}
.about .side dd{font-weight:600}
.about .main h2{margin-bottom:1.75rem}
.about .main p{font-size:var(--step-lead);line-height:1.42;max-width:44ch}
.about .main p+p{margin-top:1em}
.about .word{font-size:var(--step-small);font-weight:600;padding-top:.3rem}
.about .lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gutter) clamp(2rem,4vw,4rem)}
.about .lists h3{font-size:var(--step-lead);font-weight:600;margin-bottom:1rem}
.about .lists li{padding:.7rem 0;max-width:40ch}
.about .lists li+li{margin-top:2px}
.about .no li{color:var(--text)}
.guar{text-align:center;padding-block:clamp(6rem,4rem + 7vw,12rem)}
.guar h2{max-width:20ch;margin-inline:auto}
.guar .txt{max-width:56ch;margin:2rem auto 0;text-align:left;display:grid;gap:1rem}
.guar .txt p:last-child{font-weight:600}
.price .grid{align-items:start}
.price .left{grid-column:1/7;padding-top:6rem;display:grid;gap:1.5rem;align-content:start}
.price .left p{max-width:46ch}
.price .slip{grid-column:8/12;--muted:#53666f;background:var(--paper);color:var(--ink);padding:2.5rem 1.75rem 3.5rem;margin-top:calc(-1 * var(--gap-section) - 1px);clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),95% 100%,90% calc(100% - 14px),85% 100%,80% calc(100% - 14px),75% 100%,70% calc(100% - 14px),65% 100%,60% calc(100% - 14px),55% 100%,50% calc(100% - 14px),45% 100%,40% calc(100% - 14px),35% 100%,30% calc(100% - 14px),25% 100%,20% calc(100% - 14px),15% 100%,10% calc(100% - 14px),5% 100%,0 calc(100% - 14px))}
.price .slip h3{text-align:center;font-size:var(--step-body);font-weight:700;margin-bottom:1.75rem}
.price .slip li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;line-height:1.35}
.price .slip li+li{margin-top:.9rem}
.price .slip li small{display:block;font-size:var(--step-small);color:var(--muted)}
.price .slip .grp{margin:1.5rem 0 .75rem;font-weight:700;font-size:var(--step-small)}
.price .slip .total.sum{margin-top:1.5rem;padding-top:3.25rem;border-top:4px solid var(--ink)}
.price .slip .sum li{color:var(--muted)}
.price .slip .sum li s{text-decoration-thickness:.08em}
.price .slip .total{display:grid;justify-items:end;gap:.25rem;margin-top:1rem}
.price .slip .total span{font-weight:600}
.price .slip .total b{font-family:var(--display);font-weight:400;font-size:clamp(2rem,1rem + 2vw,2.75rem);letter-spacing:-.02em}
.price .slip .was{color:var(--muted);font-size:var(--step-small);text-align:right;margin-top:.35rem}
.price .slip .pay{text-align:right;font-size:var(--step-small);color:var(--muted);margin-top:.35rem}
.price .calc{background:rgba(255,255,255,.08);padding:1.5rem;display:grid;gap:.9rem;max-width:520px}
.price .calc label{font-weight:600}
.price .calc .in{display:flex;align-items:center;gap:.5rem;background:#fff;color:var(--ink);padding:0 1rem;min-height:52px;max-width:240px}
.price .calc input{border:0;outline:0;background:transparent;font:600 var(--step-lead)/1 var(--body);width:100%;color:var(--ink)}
.price .calc .in:focus-within{outline:3px solid var(--ice);outline-offset:2px}
.price .calc output{font-size:var(--step-lead);line-height:1.35}
.price .calc output b{font-family:var(--display);font-weight:400}
.price .out{grid-column:1/7;margin-top:4rem}
.price .out h3{font-size:var(--step-lead);font-weight:600;margin-bottom:1rem}
.price .out li{padding:.9rem 0;max-width:58ch;color:var(--on-dark)}
.price .out li b{color:#fff;font-weight:600}
.price .out li+li{margin-top:0}
.steps6 .hdr{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap}
.steps6 .hdr h2 span{display:block}
.steps6 .hdr h2 span:first-child{color:var(--muted)}
.steps6 .hdr p{max-width:52ch;margin-top:1rem;color:var(--text)}
.bands{margin-top:3.5rem;display:grid;gap:4px}
.bands li{display:grid;grid-template-columns:minmax(9rem,22%) minmax(0,1fr);gap:var(--gutter);padding:1.25rem 1.25rem;background:var(--white)}
.bands li:nth-child(even){background:#f7fafb}
.bands .when{font-family:var(--display);font-size:var(--step-small);letter-spacing:-.01em;line-height:1.35;color:var(--petrol)}
.bands b{display:block;font-size:var(--step-body);font-weight:600;margin-bottom:.35rem}
.bands p{max-width:70ch;color:var(--text)}
.faq .grid{align-items:start}
.faq .side{grid-column:1/4;display:grid;gap:1.25rem;align-content:start}
.faq .cols{grid-column:5/13;columns:2;column-gap:56px}
.faq .cols p{break-inside:avoid;margin-bottom:1.25rem;line-height:1.55;color:var(--text)}
.faq .cols p b{font-weight:600;color:var(--ink)}
.close{min-height:90svh;display:flex;flex-direction:column;justify-content:space-between;padding-block:clamp(5rem,3rem + 6vw,9rem) 2.5rem}
.close h2{font-size:clamp(1.875rem,.6rem + 6vw,7.5rem);line-height:.98;letter-spacing:-.04em;max-width:16ch}
.close .base{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap;margin-top:4rem}
.close .base p{max-width:44ch;font-size:var(--step-lead);line-height:1.38}
.close .btn{min-height:58px;padding-inline:32px}
.foot{padding:9rem var(--margin) 2rem;overflow:hidden}
.foot .name{font-family:var(--display);font-size:clamp(3rem,1rem + 15.5vw,15rem);line-height:.8;letter-spacing:-.05em;white-space:nowrap;margin-left:-.04em}
.foot .row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);margin-top:4.5rem}
.foot .places{grid-column:1/7;display:grid;gap:.5rem}
.foot .places a{font-size:var(--step-lead);text-decoration:none;color:var(--ice)}
.foot .places a:hover{text-decoration:underline}
.foot .more{grid-column:8/13;display:grid;gap:.6rem;align-content:start}
.foot .more a{text-decoration:none}
.foot .more a:hover{text-decoration:underline}
.foot .legal{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:5rem;font-size:var(--step-small);color:var(--on-dark-2)}
.dock{position:fixed;left:8px;right:8px;bottom:8px;z-index:10;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;background:var(--petrol);color:#fff;border-radius:999px;transform:translateY(140%);transition:transform 320ms var(--ease-out)}
.dock.on{transform:none}
.dock b{font-family:var(--display);font-weight:400;font-size:var(--step-body)}
.dock span{display:block;font-size:13px;color:var(--on-dark-2)}
.dock .btn{background:#fff;color:var(--petrol);min-height:46px;padding:10px 18px}
@media (prefers-reduced-motion:no-preference){
.js [data-rise]{opacity:0;transform:translateY(18px);animation:rise var(--t-reveal) var(--ease-out) forwards;animation-delay:calc(var(--i,0) * 90ms + 120ms)}
.js .lines .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.js .lines .ln>span{display:block;transform:translateY(105%);animation:lineup 900ms var(--ease-out) forwards;animation-delay:calc(var(--i,0) * 110ms + 150ms)}
.js .shutter{clip-path:inset(0 0 100% 0);transition:clip-path 1100ms var(--ease-in-out)}
.js .shutter>*{transform:scale(1.12);transition:transform 1500ms var(--ease-soft)}
.js .shutter.is-in{clip-path:inset(0)}
.js .shutter.is-in>*{transform:none}
.js [data-reveal]>*{opacity:0;transform:translateY(24px);transition:opacity 700ms var(--ease-out),transform 900ms var(--ease-out)}
.js [data-reveal].is-in>*{opacity:1;transform:none}
.js [data-reveal].is-in>*:nth-child(2){transition-delay:80ms}
.js [data-reveal].is-in>*:nth-child(3){transition-delay:160ms}
.js [data-reveal].is-in>*:nth-child(4){transition-delay:240ms}
.js [data-reveal].is-in>*:nth-child(n+5){transition-delay:300ms}
.js .bands li{opacity:0;transform:translateX(-16px);transition:opacity 600ms var(--ease-out),transform 700ms var(--ease-out)}
.js .bands.is-in li{opacity:1;transform:none}
.js .bands.is-in li:nth-child(2){transition-delay:70ms}.js .bands.is-in li:nth-child(3){transition-delay:140ms}
.js .bands.is-in li:nth-child(4){transition-delay:210ms}.js .bands.is-in li:nth-child(5){transition-delay:280ms}.js .bands.is-in li:nth-child(6){transition-delay:350ms}
.js .sq{opacity:0;transition:opacity 500ms var(--ease-out),transform 900ms var(--ease-out)}
.js .diagram.is-in .sq{opacity:1}
.js .wa .msg{opacity:0;transform:translateY(10px) scale(.98);animation:rise 520ms var(--ease-out) forwards;animation-delay:calc(1.1s + var(--i,0) * 900ms)}
[data-ui]{transition:transform 400ms var(--ease-out)}
.t-ad:hover [data-ui],.t-wa:hover [data-ui],.ui-wrap:hover [data-ui]{transform:translateY(-4px)}
.foot .places a{transition:transform var(--t-hover) var(--ease-out)}
.foot .places a:hover{transform:translateX(6px)}
}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes lineup{to{transform:none}}
@media (max-width:1023px){
.board{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:6px;padding:6px;min-height:0;height:auto}
.bar{grid-template-columns:auto 1fr;height:56px}
.bar nav{display:none}
.bar .act{justify-content:flex-end}
.t-title{grid-column:1/-1;padding:3.5rem 20px 24px}
.t-ad{grid-column:1/-1}
.t-wa{grid-column:1/-1}
.t-say,.t-go{grid-column:span 1;min-height:44vw;padding:18px}
.intro .stmt{grid-column:1/-1;text-indent:0;font-size:1.375rem;max-width:none}
.intro .note{grid-column:1/-1;grid-row:2;margin-top:2rem}
.intro .fig{grid-column:1/-1;grid-row:3;margin-top:2rem}
.how .top h2,.how .top p{grid-column:1/-1}
.how .top p{margin-top:1.25rem}
.feat h2{grid-column:1/-1;position:static;max-width:none}
.feat .blocks{grid-column:1/-1;margin-top:2rem;gap:4.5rem}
.feat .row{grid-template-columns:1fr}
.feat .row.flip{grid-template-columns:1fr}
.feat .row.flip>.ui-wrap{order:0}
.feat .bonus h3,.feat .bonus dl{grid-column:1/-1}
.feat .bonus dl{grid-template-columns:1fr}
.about .r1,.about .r2{grid-template-columns:1fr;row-gap:2rem}
.about .r1 .side{grid-template-columns:132px 1fr;align-items:end;order:2}
.about .lists{grid-template-columns:1fr}
.price .left,.price .out{grid-column:1/-1;padding-top:0}
.price .slip{grid-column:1/-1;width:86%;margin:3rem auto 0;justify-self:center}
.faq .side,.faq .cols{grid-column:1/-1}
.faq .cols{columns:1;margin-top:2.5rem}
.foot .places,.foot .more{grid-column:1/-1}
.foot .more{margin-top:2.5rem;grid-template-columns:1fr 1fr}
.dock{display:flex}
}
@media (max-width:640px){
.bands{gap:1.75rem}
.bands li,.bands li:nth-child(even){background:transparent;padding:0}
.guar h2{font-size:1.5rem}
.head{font-size:1.625rem}
.how .steps{grid-template-columns:1fr;gap:2rem}
.bands li{grid-template-columns:1fr;gap:.35rem}
.close .btn{width:100%}
.close{min-height:80svh}
.steps6 .hdr .btn{width:100%}
}
/* ajuste de layout: os exemplos visuais se adaptam ao espaço disponível */
.blocks article,.row>*,.ui-wrap{min-width:0}
.ui-wrap{max-width:100%;container-type:inline-size}
[data-ui].sheet,[data-ui].src,[data-ui].thumbs{min-width:0;max-width:100%}
[data-ui].sheet th{white-space:normal;vertical-align:bottom}
@media (max-width:1023px){.row,.row.flip{grid-template-columns:minmax(0,1fr)}}
@container (max-width:440px){
[data-ui].thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
[data-ui].thumbs div{padding:8px}
[data-ui].sheet{font-size:10.5px}
[data-ui].sheet th,[data-ui].sheet td{padding:5px 4px}
}
@container (max-width:300px){
[data-ui].sheet{font-size:9.5px}
[data-ui].sheet th,[data-ui].sheet td{padding:4px 3px}
}
/* topo: preço e texto acompanham a largura do bloco */
.t-go{container-type:inline-size}
.t-go .price{font-size:clamp(1.25rem,15cqi,2.75rem);white-space:nowrap}
@media (max-width:374px){.foot .places a{font-size:1.125rem}}
.foot .places a{overflow-wrap:anywhere}
@media (min-width:1024px){.t-say{container-type:inline-size}.t-say p{font-size:clamp(1.0625rem,10cqi,var(--step-lead))}}
.bar nav a{white-space:nowrap}
@media (max-width:1199px){.bar nav ul{margin-left:auto;margin-right:auto;gap:22px}}
/* rodapé: o nome ocupa a largura sem passar da margem */
.foot{container-type:inline-size}
.foot .name{font-size:min(clamp(3rem,1rem + 15.5vw,15rem),calc(100cqi / 5.78))}
@media (max-width:374px){.t-say,.t-go{grid-column:1/-1;min-height:0}}
@media (max-width:420px){.price .slip{width:100%;padding-left:1.25rem;padding-right:1.25rem}}
/* perguntas: a pergunta em linha própria, com uma divisória entre elas */
.faq .cols p{padding-top:1.1rem;border-top:1px solid #dbe4e8;margin-bottom:1.6rem}
.faq .cols p b{display:block;margin-bottom:.4rem;font-size:var(--step-body);line-height:1.35}
/* bônus: em telas médias, as três colunas usam a largura toda */
@media (min-width:1024px) and (max-width:1279px){.feat .bonus h3,.feat .bonus dl{grid-column:1/-1}}
/* ilustrações: post impulsionado, anúncio do topo e as 5 imagens */
[data-ui].post .hd{display:flex;align-items:center;gap:10px;padding:10px 12px}
[data-ui].post .hd .av{width:30px;height:30px;border-radius:50%;background:var(--petrol);flex:none}
[data-ui].post .hd .nm{font-size:13px;font-weight:600;line-height:1.2;color:#111b21}
[data-ui].post .hd .sp{display:block;font-size:12px;font-weight:400;color:#65676b}
[data-ui].post .hd i{margin-left:auto;font-style:normal;font-size:11px;letter-spacing:1px;color:#65676b}
[data-ui].post .img{position:relative;overflow:hidden;background:linear-gradient(160deg,#dbe9ef,#b9d1dc)}
[data-ui].post .shape{position:absolute;display:block}
[data-ui].post .s1{width:58%;aspect-ratio:1;border-radius:50%;background:var(--petrol);top:-14%;right:-12%}
[data-ui].post .s2{width:46%;aspect-ratio:1;border-radius:50%;background:#fff;opacity:.55;bottom:-16%;left:-10%}
[data-ui].post .lbl{position:relative;background:#fff;border-radius:6px;padding:6px 10px;box-shadow:0 1px 2px rgba(14,39,50,.12)}
[data-ui].post .acts{display:flex;gap:14px;padding:10px 12px 0}
[data-ui].post .acts svg{width:22px;height:22px;fill:none;stroke:#111b21;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
[data-ui].post .acts .heart{fill:#e0245e;stroke:#e0245e}
[data-ui].post .acts .save{margin-left:auto}
[data-ui].post .ft{align-items:center}
[data-ui].post .ft .none{background:#f0f2f5;color:#53666f;border-radius:999px;padding:3px 10px;font-size:12px}
[data-ui].ad .img{position:relative;overflow:hidden}
[data-ui].ad .img b,[data-ui].ad .img span{position:relative}
[data-ui].ad .cal{position:absolute;right:-5%;bottom:-9%;width:38%;height:auto;fill:none;stroke:var(--ice);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.28}
[data-ui].ad .cal .ok{stroke:#fff;stroke-width:3.2;opacity:.9}
.feat [data-ui].thumbs div{flex-direction:column;align-items:flex-start;gap:6px}
.feat [data-ui].thumbs div::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;opacity:.55;margin-bottom:auto}
.feat [data-ui].thumbs div::after{content:"";width:62%;height:7px;border-radius:999px;background:currentColor;opacity:.35}
.feat [data-ui].thumbs div:nth-child(4){border:1px solid #d6e2e8}
@container (max-width:440px){.feat [data-ui].thumbs div:first-child{grid-row:span 2;aspect-ratio:auto}}
