/* Shared styles for the content pages (features, help, about, faq, contact, privacy, terms, 404). */
html:not([lang="pa"]) .pa{display:none!important}
html[lang="pa"] .en{display:none!important}
.wrap{max-width:1120px;margin:0 auto;padding:0 clamp(16px,4vw,32px)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:8px;z-index:20}
.skip:focus{left:8px}
.topbar{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line)}
.topbar .wrap{display:flex;align-items:center;gap:14px;min-height:68px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.15rem;text-decoration:none;letter-spacing:-.01em}
.brand img{border-radius:50%}
#menu{display:flex;gap:2px;margin-left:16px;flex:1;flex-wrap:wrap}
#menu a{text-decoration:none;font-weight:600;font-size:.94rem;color:var(--muted);padding:7px 13px;border-radius:999px;transition:background .15s,color .15s}
#menu a:hover{background:var(--mist);color:var(--ink)}
#menu a[aria-current="page"]{background:var(--mist);color:var(--ink);box-shadow:inset 0 -2px 0 var(--field)}
.tools{display:flex;align-items:center;gap:10px;margin-left:auto}
.cta.small{padding:8px 18px;font-size:.9rem;border-radius:999px}
.menubtn{display:none;font:inherit;font-size:1.3rem;line-height:1;background:#fff;border:1px solid var(--line);border-radius:10px;padding:5px 11px;cursor:pointer;margin-left:auto}
.phero{background:radial-gradient(900px 360px at 85% -20%,rgba(242,190,26,.28),transparent 70%),linear-gradient(180deg,#FFFBEE,#fff);border-bottom:1px solid var(--line);padding:clamp(36px,6vw,76px) 0 clamp(36px,6vw,72px);position:relative;overflow:hidden}
.phero .wrap{position:relative}
.phero h1{margin:0;font-weight:800;font-size:clamp(2.2rem,6vw,3.9rem);line-height:1.08;letter-spacing:-.025em}
.phero h1::after{content:"";display:block;width:56px;height:5px;border-radius:3px;background:var(--field);margin-top:18px}
.psub{margin:16px 0 0;font-size:clamp(1.05rem,1.8vw,1.3rem);font-weight:500;color:var(--muted);max-width:40ch}
section.block{padding:clamp(40px,6vw,76px) 0}
section.block.alt{background:var(--mist)}
section.block h2.title{margin:0 0 24px;font-size:clamp(1.5rem,3.2vw,2.1rem);line-height:1.2;letter-spacing:-.015em}
.lead{font-size:1.12rem;color:var(--muted);max-width:58ch;margin:0 0 28px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cards.three{margin:28px 0}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;transition:transform .2s,box-shadow .2s,border-color .2s;display:block;text-decoration:none}
section.alt .card{background:#fff}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#D6DCE3}
.card .ic{font-size:1.4rem;line-height:1;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:#FFF6D6;margin-bottom:14px}
.card h3{margin:0 0 6px;font-size:1.1rem;line-height:1.3}
.card p{margin:0;font-size:.96rem;color:var(--muted)}
.stepgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:s}
.stepgrid li{counter-increment:s;position:relative;padding-top:60px}
.stepgrid li::before{content:counter(s);position:absolute;top:0;left:0;width:44px;height:44px;border-radius:12px;background:var(--ink);color:var(--field);font-weight:800;font-size:1.15rem;display:grid;place-items:center}
.stepgrid h3{margin:0 0 6px;font-size:1.12rem}
.stepgrid p{margin:0;color:var(--muted);font-size:.96rem}
.examples{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.examples li{background:#fff;border:1px solid var(--line);border-left:4px solid var(--field);border-radius:12px;padding:14px 18px;font-weight:600}
.ticks{list-style:none;margin:0;padding:0;max-width:760px}
.ticks li{position:relative;padding:8px 0 8px 36px}
.ticks li::before{content:"✓";position:absolute;left:0;top:9px;width:24px;height:24px;border-radius:50%;background:#E4F3EC;color:var(--leaf);font-size:.8rem;display:grid;place-items:center;font-weight:800}
.prose{max-width:760px}
.prose h2{margin:1.9em 0 .4em;font-size:1.4rem;line-height:1.3;letter-spacing:-.01em}
.prose h2:first-child,.prose .meta+h2{margin-top:0}
.prose p,.prose li{color:#33424F}
.prose ul{padding-left:1.3em}
.prose li{margin:.35em 0}
.prose a,.faq a,.lead a{color:var(--leaf);font-weight:600}
.meta{color:var(--muted);font-size:.92rem;margin:0 0 1.4em}
.faq{max-width:820px}
.faq details{border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin-bottom:10px;background:#fff;transition:box-shadow .2s}
.faq details[open]{box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font-weight:600;font-size:1.06rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;line-height:1;transition:transform .2s;flex:none;color:var(--leaf-2)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:10px 0 0;color:var(--muted)}
.cta-band{background:linear-gradient(135deg,#0E1B26,#17303F 60%,#1E5B47);color:#fff;border-radius:24px;padding:clamp(26px,4vw,48px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cta-band p{margin:0;font-size:clamp(1.3rem,3vw,1.9rem);font-weight:800;line-height:1.25;letter-spacing:-.01em}
.cta-band .cta{background:var(--field);border-color:var(--field);color:var(--ink)}
.cta-band .cta:hover{background:var(--field-2)}
.linkcard{color:inherit}
.notfound{text-align:center;padding:clamp(24px,8vw,96px) 0}
.notfound .big404{font-size:clamp(5rem,20vw,10rem);font-weight:800;line-height:1;margin:0;background:linear-gradient(135deg,#E8A21A,#F2BE1A,#2A7A60);-webkit-background-clip:text;background-clip:text;color:transparent}
.notfound h1{margin:.2em 0 .2em;font-size:clamp(1.6rem,4vw,2.4rem)}
.notfound .cta{margin:6px 4px}
.sitefoot{background:var(--ink);color:#B7C2CC;padding:clamp(36px,5vw,60px) 0 24px;font-size:.94rem}
.sitefoot .brand{color:#fff}
.sitefoot p{margin:10px 0 0;max-width:30ch}
.fcols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.fcols h2{margin:0 0 10px;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--field)}
.fcols a:not(.brand){display:block;color:#B7C2CC;text-decoration:none;padding:4px 0}
.fcols a:not(.brand):hover{color:#fff}
.sitefoot .fine{max-width:none;text-align:center;border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:18px;font-size:.86rem}
@media (max-width:900px){.stepgrid{grid-template-columns:1fr 1fr}.fcols{grid-template-columns:1fr 1fr}.cards{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
 .menubtn{display:block}
 #menu{display:none;order:5;flex-basis:100%;flex-direction:column;margin:0 0 10px}
 #menu.open{display:flex}
 #menu a{padding:10px 12px}
 .tools{order:4;flex-basis:100%;margin:0 0 10px;justify-content:space-between}
 .examples{grid-template-columns:1fr}
}
@media (max-width:520px){.cards,.stepgrid,.fcols{grid-template-columns:1fr}}
.morelinks{margin:28px 0 0;display:flex;gap:12px;flex-wrap:wrap}