.article-page{background:#f4f3ee}.article-page main{overflow:hidden}.article-shell{background:#f4f3ee}.article-back{position:fixed;z-index:24;left:clamp(20px,4vw,64px);bottom:22px;padding:10px 15px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(20,32,37,.68);color:#fff;font-size:11px;font-weight:680;backdrop-filter:blur(16px)}
.article-hero{position:relative;min-height:clamp(560px,75vh,820px);display:grid;align-items:end;padding:clamp(130px,14vw,190px) max(var(--pad),calc((100vw - var(--max))/2 + var(--pad))) clamp(60px,8vw,105px);overflow:hidden;background:#15262e;color:#fff}.article-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62}.article-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,18,24,.92),rgba(8,18,24,.4)),linear-gradient(0deg,rgba(8,18,24,.88),rgba(8,18,24,.04))}.article-hero-copy{position:relative;z-index:1;max-width:1040px}.article-hero .eyebrow{margin:0 0 20px;color:#bdd1d7;font-size:10px;font-weight:740;letter-spacing:.11em;text-transform:uppercase}.article-hero h1{max-width:1100px;margin:0;font-size:clamp(38px,5vw,72px);font-weight:510;letter-spacing:-.05em;line-height:1.04;text-wrap:balance;overflow-wrap:break-word;hyphens:none}.article-hero p:not(.eyebrow){max-width:820px;margin:28px 0 0;color:rgba(255,255,255,.77);font-size:clamp(16px,1.5vw,21px);line-height:1.65}
.article-breadcrumbs,.article-meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:rgba(255,255,255,.7);font-size:11px}.article-breadcrumbs{margin-bottom:20px}.article-meta{margin-top:24px}.article-layout{max-width:var(--max);display:grid;grid-template-columns:minmax(190px,250px) minmax(0,820px);justify-content:center;gap:clamp(40px,7vw,100px);margin:auto;padding:clamp(70px,8vw,115px) var(--pad) clamp(100px,10vw,150px)}.article-toc{position:sticky;top:104px;align-self:start;display:grid;border-top:1px solid var(--line)}.article-toc span,.article-toc a{padding:12px 0;border-bottom:1px solid var(--line);font-size:11px}.article-toc span{color:var(--water);font-weight:720;text-transform:uppercase}.article-toc a{color:var(--muted)}.article-toc a:hover{color:var(--ink)}
.article-content{max-width:820px}.article-content section{padding:38px 0;border-top:1px solid var(--line)}.article-content section:first-child{padding-top:0;border-top:0}.article-content .lead{margin-top:0;color:var(--ink);font-size:clamp(20px,2vw,27px);line-height:1.58}.article-content h2{margin:0 0 22px;font-size:clamp(30px,3.5vw,48px);font-weight:540;letter-spacing:-.045em;line-height:1.08}.article-content h3{margin:30px 0 12px;font-size:23px;font-weight:620;letter-spacing:-.025em}.article-content p,.article-content li{color:#4f5553;font-size:16px;line-height:1.82}.article-content ul{padding-left:22px}.article-content blockquote,.article-note{margin:28px 0;padding:24px 26px;border-left:3px solid var(--water);background:rgba(94,128,139,.1)}.article-content blockquote{color:var(--ink);font-size:20px;line-height:1.55}.article-note strong{display:block;margin-bottom:8px}.article-note p{margin:0}
.article-author-intro{display:grid;grid-template-columns:minmax(190px,250px) minmax(0,1fr);gap:36px;align-items:start}.article-author-intro figure{margin:0;overflow:hidden;border-radius:6px}.article-author-intro img{width:100%;height:auto}.article-figure{margin:30px 0}.article-figure img{width:100%;height:auto;border-radius:5px}.article-figure-wide img{aspect-ratio:16/9;object-fit:cover}.article-figure-project img{max-height:720px;object-fit:cover}.article-figure figcaption{margin-top:10px;color:var(--muted);font-size:12px;line-height:1.55}
.article-step-grid,.article-benefits,.article-mistakes,.article-related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0}.article-step-grid article,.article-benefits article,.article-mistakes article,.article-related-grid a{padding:22px;border:1px solid var(--line);background:rgba(255,255,255,.58)}.article-step-grid h3,.article-benefits h3,.article-mistakes h3{margin:0 0 8px;font-size:19px}.article-step-grid p,.article-benefits p,.article-mistakes p{margin:0;font-size:14px}.article-related-grid a{display:grid;gap:7px}.article-related-grid span{color:var(--water);font-size:10px;font-weight:740;text-transform:uppercase}.article-related-grid strong{font-size:17px;line-height:1.4}
.article-numbered-flow{margin:26px 0;padding:0;list-style:none;counter-reset:steps}.article-numbered-flow li{position:relative;min-height:58px;padding:0 0 24px 56px;counter-increment:steps}.article-numbered-flow li:before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;color:var(--water);font-weight:760}.article-numbered-flow li:not(:last-child):after{content:"";position:absolute;top:30px;bottom:2px;left:13px;width:1px;background:var(--line)}
.article-comparison{margin:28px 0;overflow-x:auto;border:1px solid var(--line);background:rgba(255,255,255,.58)}.article-comparison table{width:100%;min-width:660px;border-collapse:collapse}.article-comparison th,.article-comparison td{padding:16px 18px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:14px;line-height:1.55}.article-comparison th{background:rgba(94,128,139,.12)}.article-spec{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:28px 0;border:1px solid var(--line);background:var(--line)}.article-spec div{padding:20px;background:#fff}.article-spec span,.article-spec strong{display:block}.article-spec span{color:var(--muted);font-size:11px}.article-spec strong{margin-top:6px;font-size:17px}
.article-figure-pair{display:grid;grid-template-columns:.9fr 1.1fr;gap:38px;align-items:center;margin:32px 0}.article-figure-pair .article-figure{margin:0}.article-faq details{border-top:1px solid var(--line)}.article-faq details:last-of-type{border-bottom:1px solid var(--line)}.article-faq summary{padding:20px 34px 20px 0;font-weight:680;cursor:pointer}.article-faq details p{margin-top:0;padding:0 34px 20px 0}.article-author-card{display:grid;grid-template-columns:112px 1fr;gap:24px;align-items:center;margin:30px 0;padding:24px;border:1px solid var(--line);background:#fff}.article-author-card img{width:112px;height:112px;object-fit:cover}.article-author-card h2{margin:0 0 8px;font-size:24px}.article-author-card p{margin:0;font-size:14px}
.price-grid,.example-list{display:grid;gap:12px;margin:28px 0}.price-grid{grid-template-columns:repeat(3,1fr)}.price-grid div,.example-list article{padding:22px;border:1px solid var(--line);background:rgba(255,255,255,.58)}.price-grid span{display:block;min-height:42px;color:var(--muted);font-size:12px;font-weight:650}.price-grid strong,.example-list article strong{display:block;color:var(--water);font-size:19px}.example-list article h3{margin-top:0}
.article-cta{margin-top:32px;padding:36px;border:0!important;background:linear-gradient(135deg,#263f49,#557984);color:#fff}.article-cta h2,.article-cta p,.article-cta .eyebrow{color:#fff}.article-cta p{max-width:650px}.article-cta .button.primary{margin-top:16px;background:#fff;color:var(--deep)}.article-cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.article-cta .button.ghost{border-color:rgba(255,255,255,.4);color:#fff}.legal-hero{min-height:560px}.legal-content{width:min(820px,calc(100% - 40px));max-width:820px;margin:auto;padding:90px 0 130px}.legal-content>p:first-child{font-size:20px;color:var(--ink)}.legal-content a{text-decoration:underline;text-decoration-color:rgba(49,85,97,.4);text-underline-offset:3px}
@media(max-width:900px){.article-layout{grid-template-columns:1fr}.article-toc{position:static;grid-template-columns:repeat(2,1fr)}.article-toc span{grid-column:1/-1}}
@media(max-width:620px){.article-back{display:none}.article-hero{min-height:500px;padding:120px 20px 52px}.article-hero h1{font-size:34px}.article-layout{padding:48px 20px 90px}.article-toc{grid-template-columns:1fr}.article-content h2{font-size:30px;overflow-wrap:break-word;hyphens:none}.article-content h3{font-size:21px;overflow-wrap:break-word;hyphens:none}.article-content p,.article-content li{font-size:15px}.article-author-intro{display:block}.article-author-intro figure{width:min(260px,78vw);margin-bottom:22px}.article-step-grid,.article-benefits,.article-mistakes,.article-related-grid,.article-figure-pair,.article-spec,.price-grid{grid-template-columns:1fr}.article-figure-wide img{aspect-ratio:4/3}.article-author-card{grid-template-columns:76px 1fr;padding:18px}.article-author-card img{width:76px;height:76px}.article-content blockquote{font-size:17px}.article-cta{padding:26px 22px}}