/* Noticewold "greenroom": aubergine, tangerine, apricot cream and lagoon teal on warm paper.
   Book-face serif headings (Palatino family) over a humanist sans body; text-left heroes on aubergine,
   before/during/after timeline, badge cards, speech-bubble questions, script-card worked examples. */
:root{--au:#3B1E54;--au2:#55307A;--aud:#28123B;--tg:#EE7B30;--tgd:#C25A16;--ap:#FFF3E8;--ap2:#FBE0C8;--lg:#12737A;--lgd:#0C555B;--lgt:#DDF0EF;--pp:#FFFCF8;--ink:#221A2B;--mut:#5A5063;--ln:#E8DCD0;--w:#fff}
*{box-sizing:border-box}
html{scroll-padding-top:120px}
body{margin:0;font-family:"Segoe UI","Noto Sans","Helvetica Neue",Arial,sans-serif;font-size:17px;line-height:1.66;color:var(--ink);background:var(--pp)}
h1,h2,h3{font-family:"Palatino Linotype","Book Antiqua",Palatino,"URW Palladio L","P052",Georgia,serif;color:var(--au);line-height:1.2;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(2rem,4.2vw,3.2rem)}
h2{font-size:clamp(1.45rem,2.5vw,2.05rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
a{color:var(--lg)}a:hover{color:var(--tgd)}
img{max-width:100%;height:auto;display:block}
.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;z-index:60;background:var(--w);padding:8px 12px}
.wrap{max-width:1180px;margin:0 auto;padding:0 30px}
.narrow{max-width:820px}
.nw,.tel{white-space:nowrap}
/* sticky aubergine header with a tangerine pill */
header,.mast{position:sticky;top:0;z-index:30}
.mast{background:var(--au);box-shadow:0 3px 0 var(--tg)}
.mbar{max-width:1240px;margin:0 auto;padding:10px 26px;display:flex;align-items:center;gap:18px}
.logo img{width:196px;height:auto}
.mast nav{margin-left:auto}
.mast nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;white-space:nowrap}
.mast nav a{display:block;color:#F4E9FA;text-decoration:none;font-weight:600;font-size:.97rem;padding:6px 12px;border-radius:999px}
.mast nav a:hover{background:var(--au2);color:var(--w)}
.mast nav a[aria-current]{background:var(--ap);color:var(--au)}
.cta{background:var(--tg);color:var(--aud);text-decoration:none;font-weight:700;padding:9px 20px;border-radius:999px;white-space:nowrap}
.cta:hover{background:var(--ap);color:var(--au)}
/* home hero: copy on aubergine left, photo right in a tangerine offset frame */
.hero{margin:0;padding:0;background:var(--au);color:#F6EEFB}
.hero img,.hero picture img{object-fit:cover;object-position:center top}
.hgrid{display:grid;grid-template-columns:1fr 1.12fr;gap:52px;align-items:center;padding-top:56px;padding-bottom:64px}
.hero h1{color:var(--w)}
.hero .lede{color:#EBDDF3;font-size:1.13rem}
.hero .kick{color:var(--tg)}
.hpic{position:relative}
.hpic::after{content:"";position:absolute;inset:-14px 18px 18px -14px;border:4px solid var(--tg);border-radius:18px;z-index:0}
.hpic img{position:relative;z-index:1;width:100%;aspect-ratio:16/9;border-radius:14px}
.kick{font-size:.8rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--tgd);margin-bottom:.6em}
.lede{font-size:1.1rem;color:var(--mut)}
.acts{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:22px}
.btn{display:inline-block;background:var(--tg);color:var(--aud);text-decoration:none;font-weight:700;padding:12px 26px;border-radius:999px}
.btn:hover{background:var(--tgd);color:var(--w)}
.btn.au{background:var(--au);color:var(--w)}.btn.au:hover{background:var(--aud)}
.tlink{font-weight:700;color:var(--lg);text-decoration-thickness:2px;text-underline-offset:4px}
.hero .tlink{color:#FFD9BD}
/* trust strip */
.strip{background:var(--tg);color:var(--aud)}
.strip ul{list-style:none;margin:0 auto;padding:14px 30px;max-width:1180px;display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:8px 22px;font-size:.95rem}
.strip b{font-weight:800}
.sec{padding:66px 0}
.sec.cream{background:var(--ap)}
.sec.teal{background:var(--lgt)}
.sh{max-width:760px;margin-bottom:30px}
/* before / during / after timeline */
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:4px solid var(--au)}
.timeline li{position:relative;padding:34px 24px 6px 0}
.timeline li::before{content:attr(data-when);position:absolute;top:-17px;left:0;background:var(--au);color:var(--w);font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 14px;border-radius:999px}
.timeline h3{color:var(--lgd)}
/* cards with a reading-time badge over the photo */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{background:var(--w);border-radius:16px;overflow:hidden;box-shadow:0 1px 0 var(--ln),0 10px 24px -18px rgba(59,30,84,.55);display:flex;flex-direction:column}
.card .ph{position:relative}
.card .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 25%}
.badge{position:absolute;left:14px;bottom:14px;background:var(--au);color:var(--w);font-size:.78rem;font-weight:700;padding:4px 12px;border-radius:999px}
.cbody{padding:20px 22px 22px}
.cbody h3,.cbody h2{font-size:1.25rem}
.cbody h3 a,.cbody h2 a{color:var(--au);text-decoration:none}
.cbody h3 a:hover,.cbody h2 a:hover{color:var(--tgd)}
.tag{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:var(--lg);margin-bottom:.35em}
.card.plain{border-left:6px solid var(--tg)}
.more{margin-top:24px}
/* split rows */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.duo picture img{border-radius:16px;aspect-ratio:4/3;object-fit:cover;object-position:50% 25%;box-shadow:14px 14px 0 var(--ap2)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.minis{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.minis li{background:var(--w);border:1px solid var(--ln);border-left:5px solid var(--lg);border-radius:10px;padding:12px 16px}
.minis b{display:block;color:var(--au)}
/* key terms: teal cards */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:0 0 1.4em}
.tiles.three{grid-template-columns:repeat(3,1fr)}
.tiles div{background:var(--lgt);border-radius:12px;padding:16px 18px;border-top:4px solid var(--lg)}
.tiles dt{font-weight:800;color:var(--lgd);margin-bottom:4px}
.tiles dd{margin:0;font-size:.96rem}
.checks{list-style:none;padding:0;margin:0 0 1em}
.checks li{position:relative;padding-left:30px;margin-bottom:8px}
.checks li::before{content:"";position:absolute;left:2px;top:.35em;width:16px;height:16px;border-radius:50%;background:var(--tg)}
.box{background:var(--w);border-radius:14px;padding:22px 24px;border:1px solid var(--ln)}
.box.no .checks li::before{background:var(--w);box-shadow:inset 0 0 0 3px var(--au)}
/* FAQ accordion */
details{background:var(--w);border:1px solid var(--ln);border-radius:12px;margin-bottom:12px;padding:0 20px}
details[open]{border-color:var(--tg)}
summary{cursor:pointer;font-weight:700;color:var(--au);padding:16px 0;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--tgd);font-size:1.3rem;line-height:1}
details[open] summary::after{content:"\2013"}
details p{padding-bottom:6px}
/* CTA band */
.band{background:var(--tg);color:var(--aud);padding:44px 0}
.band h2{color:var(--aud)}
.bandrow{display:flex;gap:28px;align-items:center;justify-content:space-between}
.bandrow p{margin:0;max-width:680px}
/* page heads and article heads: title on apricot left, photo right */
.phead{background:var(--ap);padding:50px 0 40px;border-bottom:3px solid var(--ap2)}
.ahero{margin:0;padding:0;background:var(--ap);border-bottom:3px solid var(--ap2)}
.ahero img,.ahero picture img{object-fit:cover;object-position:center top}
.agrid{display:grid;grid-template-columns:1.15fr .85fr;gap:46px;align-items:center;padding-top:46px;padding-bottom:50px}
.apic img{width:100%;aspect-ratio:4/3;border-radius:18px;border:6px solid var(--w);box-shadow:0 0 0 3px var(--tg)}
.crumb{font-size:.9rem;color:var(--mut)}
.crumb a{color:var(--lgd)}
.dated{font-size:.9rem;color:var(--mut);border-left:3px solid var(--tg);padding-left:10px}
/* article body with a sticky contents rail */
.abody{padding:54px 0 64px}
.agrid2{display:grid;grid-template-columns:250px minmax(0,1fr);gap:48px;align-items:start}
.rail{position:sticky;top:96px;background:var(--w);border:1px solid var(--ln);border-radius:14px;padding:18px 18px 10px;font-size:.92rem}
.rail p{font-weight:800;color:var(--au);margin-bottom:.4em}
.rail ol{margin:0;padding-left:1.15em}
.rail li{margin-bottom:6px}
.rail a{color:var(--ink);text-decoration:none}.rail a:hover{color:var(--tgd)}
.acol{max-width:760px}
.acol h2{margin-top:1.5em}
.intro{font-size:1.08rem}
.script{background:var(--au);color:#F4EAFB;border-radius:18px;padding:26px 28px;margin:2em 0}
.script h2{color:var(--w);margin-top:0}
.script .note{font-size:.9rem;color:#D9C6E6;border-top:1px dashed #8A6AA6;padding-top:10px}
.tbl{overflow-x:auto;margin:0 0 1.4em}
table{border-collapse:collapse;width:100%;font-size:.96rem;background:var(--w)}
caption{text-align:left;font-weight:700;color:var(--lgd);padding-bottom:8px}
th{background:var(--lg);color:var(--w);text-align:left;padding:10px 12px}
td{padding:10px 12px;border-bottom:1px solid var(--ln);vertical-align:top}
tr:nth-child(even) td{background:var(--ap)}
.ticks{background:var(--ap);border-radius:16px;padding:22px 26px;margin:2em 0}
.ticks h2{margin-top:0}
.ticks ul{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding-left:34px;margin-bottom:9px}
.ticks li::before{content:"";position:absolute;left:0;top:.2em;width:20px;height:20px;border:3px solid var(--au);border-radius:5px;background:var(--w)}
.bubbles{list-style:none;padding:0;margin:0 0 1.4em;display:grid;gap:12px}
.bubbles li{position:relative;background:var(--lgt);border-radius:18px 18px 18px 4px;padding:12px 18px;max-width:600px}
.bubbles li:nth-child(even){background:var(--ap2);margin-left:auto;border-radius:18px 18px 4px 18px}
.nextrow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:1.6em}
.next{display:block;background:var(--w);border:2px solid var(--au);border-radius:14px;padding:16px 18px;text-decoration:none;color:var(--au)}
.next:hover{background:var(--au);color:var(--w)}
.next span{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--tgd)}
.fine{font-size:.9rem;color:var(--mut)}
.prose h2{margin-top:1.4em}
.legal h2{font-size:1.3rem}
.upd{color:var(--mut)}
.quote{margin:0 0 1.2em;background:var(--w);border-left:5px solid var(--tg);padding:14px 18px;border-radius:0 12px 12px 0}
.bubble{background:var(--lgt);border-radius:18px 18px 18px 4px;padding:12px 18px;max-width:640px}
.qa{border-bottom:1px solid var(--ln);padding:6px 0 10px}
.qa h2{font-size:1.25rem;margin-top:1em}
.reach{list-style:none;padding:0;display:grid;gap:10px}
.reach li{display:flex;gap:14px;background:var(--w);border:1px solid var(--ln);border-radius:12px;padding:12px 16px}
.reach b{min-width:64px;color:var(--au)}
.cbox{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:1.6em}
.cbox>div{background:var(--w);border:1px solid var(--ln);border-top:4px solid var(--tg);border-radius:12px;padding:16px 18px}
.cbox h2{font-size:1.1rem}
.paths{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.paths>div{background:var(--ap);border-radius:14px;padding:18px 20px}
/* form */
.gs{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:start}
form select{max-width:100%;text-overflow:ellipsis}
.formcard{background:var(--w);border:1px solid var(--ln);border-radius:18px;padding:30px;box-shadow:0 0 0 6px var(--ap)}
.side{background:var(--ap);border-radius:16px;padding:22px 24px}
.side h2{font-size:1.15rem}
form fieldset{border:0;margin:0;padding:0;min-width:0}
form legend{font-family:"Palatino Linotype","Book Antiqua",Palatino,"P052",Georgia,serif;font-size:1.45rem;font-weight:700;color:var(--au);margin-bottom:14px;padding:0}
form label.field{display:block;font-weight:600;margin-bottom:14px;color:var(--ink)}
form input[type=text],form input[type=email],form input[type=tel],form select,form input:not([type]){display:block;width:100%;margin-top:6px;padding:11px 13px;font:inherit;font-weight:400;border:1px solid #8E7F99;border-radius:10px;background:var(--w)}
form input:focus,form select:focus{outline:3px solid var(--tg);outline-offset:1px}
form input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin:3px 0 0;accent-color:var(--au)}
form .form-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
form .err{display:block;color:#A3271B;font-size:.85rem;margin:-10px 0 8px}
form .err:empty{display:none}
form .consent-block{display:grid;grid-template-columns:24px 1fr;gap:4px 10px;align-items:start;background:var(--lgt);border:1px solid #BFE0DE;padding:14px;border-radius:12px;margin:6px 0 10px;font-size:.92rem}
form .consent-block p{grid-column:2;margin:4px 0 0;font-size:.88rem}
form label[for=lead-privacy]{display:block;position:relative;padding-left:32px;font-size:.93rem;margin:10px 0}
form label[for=lead-privacy] input{position:absolute;left:0;top:2px;margin:0}
form .hint{font-size:.9rem;color:var(--mut)}
form button{background:var(--au);color:var(--w);border:0;font:inherit;font-weight:700;padding:13px 30px;border-radius:999px;cursor:pointer;margin-top:10px}
form button:hover{background:var(--tgd)}
form .status{font-size:.9rem;color:var(--mut);margin-top:10px}
.hp,.honeypot{position:absolute;left:-9999px}
/* footer */
.foot{background:var(--aud);color:#E6D8EF;padding:50px 0 24px;font-size:.95rem}
.foot a{color:#FFD9BD}
.foot h2{color:var(--tg);font-size:1rem;text-transform:uppercase;letter-spacing:.12em;font-family:inherit}
.foot ul{list-style:none;padding:0;margin:0}.foot li{margin-bottom:6px}
.frow{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:30px}
.flegal{display:flex;flex-wrap:wrap;gap:8px 22px;border-top:1px solid #4E3566;margin-top:30px;padding-top:18px}
.flegal span{margin-right:auto}
@media(max-width:1060px){
 .mbar{flex-wrap:wrap;row-gap:6px}
 .mast nav{order:3;flex-basis:100%;margin-left:0}
 .cta{margin-left:auto}
 html{scroll-padding-top:150px}
 .agrid2{grid-template-columns:1fr}
 .rail{position:static}
 .frow{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
 .hgrid,.agrid,.duo,.two,.gs{grid-template-columns:1fr}
 .hgrid{padding-top:30px;padding-bottom:44px;gap:34px}
 .hpic{order:-1}
 .agrid{padding-top:30px;gap:26px}
 .cards,.tiles.three,.paths{grid-template-columns:1fr 1fr}
 .timeline{grid-template-columns:1fr;border-top:0;border-left:4px solid var(--au);padding-left:22px}
 .timeline li{padding:30px 0 10px}
 .bandrow{flex-direction:column;align-items:flex-start}
 .strip ul{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
 body{font-size:16px}
 .wrap{padding:0 18px}
 .mbar{padding:8px 12px}
 .logo img{width:150px}
 .cta{padding:6px 13px;font-size:.86rem}
 .mast nav ul{gap:0;justify-content:space-between}
 .mast nav a{font-size:.84rem;padding:4px 5px}
 .hpic::after{inset:-8px 10px 10px -8px}
 .cards,.paths,.tiles,.tiles.three,.nextrow,.cbox,.frow{grid-template-columns:1fr}
 .strip ul{grid-template-columns:1fr;gap:4px;padding:12px 18px}
 .sec{padding:46px 0}
 .formcard{padding:20px}
 form .form-grid{grid-template-columns:1fr}
 table thead{position:absolute;left:-9999px}
 table,tbody,tr,td{display:block;width:100%}
 caption{display:block}
 tr{border:1px solid var(--ln);border-top:4px solid var(--lg);margin-bottom:12px;border-radius:8px;overflow:hidden}
 td{display:grid;grid-template-columns:38% 1fr;gap:10px;background:var(--w)!important}
 td::before{content:attr(data-label);font-weight:700;color:var(--lgd)}
 .flegal span{margin-right:0;flex-basis:100%}
}
@media(max-width:374px){.mast nav a{font-size:.8rem;padding:4px 3px}}
