/* Sαréal618 "linen" reskin (Nov 2026). Look-only: colors, type, surfaces.
   Calm solid ivory; the only texture is a regular tone-on-tone hairline pinstripe in the hero.
   One accent color (antique gold), used only for hairlines and small details. Depth from tone, not glow. Loaded last on theme.css pages.
   Tester elements (#tester-banner, #tester-cta, #testers) keep their original look (reset block at bottom). */
:root{
  --rs-navy:#20243A;--rs-ivory:#F5F3F0;--rs-plum:#57456F;--rs-gold:#B18A4A;--rs-gold-t:#86672E;--rs-emerald:#31594A;
  --rs-muted:#5D6072;--rs-line:#E3DDD3;--rs-card:#FFFDFA;
  --cream:#F5F3F0;--stone:#EFEBE5;--ink:#20243A;--navy:#20243A;--purple:#57456F;--muted:#5D6072;
  --orange:#86672E;--orange-hi:#B18A4A;--orange-soft:#E3C891;
  --lav:#F1ECE4;--lav2:#E3DDD3;--lav3:#D3CABB;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --rest:0 1px 0 rgba(32,36,58,.04);
  --lift:0 1px 0 rgba(32,36,58,.06),0 8px 20px rgba(32,36,58,.06);
}
body{background-color:var(--rs-ivory)!important;background-image:var(--rs-weave)!important;color:var(--ink);font-family:var(--sans)}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.005em}
h2,h3{color:var(--ink)}
.o,.poster .o{color:var(--rs-plum);font-style:italic}
.eyebrow{font:600 .74rem var(--sans);letter-spacing:.2em;color:var(--rs-gold-t)}
.poster{font-family:var(--serif);font-weight:600;color:var(--rs-navy)}
::selection{background:rgba(177,138,74,.25)}

/* nav */
nav{background:rgba(245,243,240,.94);border-bottom:1px solid var(--rs-line)}
nav a{font-family:var(--sans);font-weight:500;color:#3A3E55}
nav .links a:not(.btn)::after{height:1px;background:var(--rs-gold)}
a.logo{font-family:var(--serif);font-weight:600;font-size:1.55rem;color:var(--rs-navy);letter-spacing:.005em}
a.logo::before{content:"";display:block;width:34px;height:34px;flex:none;border-radius:50%;background:url(img/theme/crest.jpg) center/cover no-repeat;padding:0}
nav .nav-contact,nav a.nav-contact{background:transparent!important;border:1px solid rgba(32,36,58,.22)!important;color:var(--rs-navy)!important;box-shadow:none!important}
nav .nav-contact:hover{background:rgba(32,36,58,.05)!important}

/* buttons */
.btn{background:var(--rs-raven-btn);background-color:var(--rs-navy);background-size:220% 100%;background-position:0 0;color:#F5F3F0!important;font-family:var(--sans);font-weight:500;letter-spacing:.01em;border-radius:999px;box-shadow:none}
.btn:hover,.btn:focus-visible{background:var(--rs-raven-btn);background-color:var(--rs-navy);background-size:220% 100%;background-position:100% 0;box-shadow:none;filter:none}
.btn:focus-visible{outline:1px solid var(--rs-gold);outline-offset:3px}
.btn.alt{background:var(--rs-plum);box-shadow:none}
.btn.alt:hover{background:#63507D;box-shadow:none}
.btn.ghost{background:transparent;color:var(--rs-navy)!important;border:1px solid rgba(32,36,58,.25);box-shadow:none}
.btn.ghost:hover{background:rgba(32,36,58,.04);border-color:rgba(32,36,58,.45)}

/* cards */
.card{background:var(--rs-card);border:1px solid var(--rs-line);border-radius:14px;box-shadow:none}
.card:hover,.vcard:hover{box-shadow:var(--lift)}

/* hero: solid ivory with one regular tone-on-tone hairline every 24px (barely visible except up close) */
.stage-hero::before{background:repeating-linear-gradient(90deg,transparent 0 191px,rgba(177,138,74,.065) 191px 192px),var(--rs-weave),var(--rs-ivory)!important}
.stage-hero h1{font-family:var(--serif);font-weight:600;color:var(--rs-navy);font-size:clamp(2.6rem,5.2vw,4.4rem);line-height:1.02;letter-spacing:-.01em}
.stage-hero h1 .o{display:inline;color:var(--rs-plum);font-style:italic;font-weight:500}
.stage-hero .lede{color:var(--rs-muted);font-size:1.08rem;line-height:1.6;max-width:30em}
.hero-copy .eyebrow{color:var(--rs-gold-t);font-size:.72rem;letter-spacing:.22em}
.botanic{display:none!important}
.included{color:var(--rs-muted);font-weight:500}
.included b{color:var(--rs-navy);font-weight:600}
.store-pill{background:var(--rs-card);border:1px solid var(--rs-line);color:var(--rs-navy);font-weight:500}
.store-pill svg path[fill="#5B3A99"],.store-pill svg circle[fill="#5B3A99"]{fill:var(--rs-navy)}
.store-pill svg rect[stroke="#5B3A99"]{stroke:var(--rs-navy)}
.chip{color:var(--rs-navy);font-family:var(--sans);font-weight:600}
.chip.o{color:var(--rs-gold-t);font-style:normal}
.thumbs button.on{box-shadow:0 0 0 1px var(--rs-gold)}

/* app preview (laptop): flat white, quiet */
.lt-screen{background:#fff;border-color:var(--rs-navy);box-shadow:0 1px 0 rgba(32,36,58,.05)}
.lt-base{background:#D6D1C8;box-shadow:none}
.lt-bar{border-bottom-color:var(--rs-line)}
.lt-bar b,.lt-head b{font-family:var(--serif);font-weight:600;color:var(--rs-navy)}
.lt-tabs em.on,.lt-side li.on{background:#F1ECE4;color:var(--rs-navy)}
.lt-side{background:#FBFAF7;border-right-color:var(--rs-line)}
.lt-week>div{border-right-color:#EFEBE5}
.lt-week i{color:#20243A}
.lt-week i.ev1{background:#E3E6EF}.lt-week i.ev2{background:#ECE6F1}.lt-week i.ev3{background:#E2ECE7}.lt-week i.ev4{background:#F3EBDD}.lt-week i.ev5{background:#EFE7E3}

/* hero cards */
.hcard{background:var(--rs-card)!important;border:1px solid var(--rs-line);border-top:2px solid var(--rs-navy);border-radius:14px;box-shadow:none}
.hero-cards .hcard:nth-child(2){border-top-color:var(--rs-plum)}
.hero-cards .hcard:nth-child(3){border-top-color:var(--rs-emerald)}
.hcard h3{font-family:var(--serif);font-weight:600;font-size:1.42rem;color:var(--rs-navy)}
.hcard .hc-txt p{color:var(--rs-muted)}
.hc-ico.ico-o,.hc-ico.ico-p{background:#F1ECE4;color:var(--rs-navy)}
.hero-cards .hcard:nth-child(2) .hc-ico{color:var(--rs-plum)}
.hero-cards .hcard:nth-child(3) .hc-ico{color:var(--rs-emerald)}
.hc-go{border:1px solid var(--rs-line);color:var(--rs-navy)}
.hc-go:hover{background:#F1ECE4;border-color:var(--rs-gold)}
.hc-demo{background:#fff;border-color:var(--rs-line)}
.hcard .who{font-family:var(--serif);font-weight:600;font-size:.98rem;color:var(--rs-navy)}
.hcard .who span{font-family:var(--sans);font-weight:600;color:var(--rs-navy)}
.hero-cards .hcard:nth-child(2) .who span{color:var(--rs-plum)}
.hero-cards .hcard:nth-child(3) .who span{color:var(--rs-emerald)}

/* section headings */
.sec-head h2,section h2{font-family:var(--serif);font-weight:600}

/* dark banner (Helping Hand): solid navy, one gold hairline */
.hh-band{background:var(--rs-navy)!important}
.hh-band::before{content:"";position:absolute;left:0;right:0;top:8px;border-top:1px solid rgba(227,200,145,.32);pointer-events:none}
.hh-band::after{content:"";position:absolute;left:0;right:0;bottom:8px;border-top:1px solid rgba(227,200,145,.32);pointer-events:none}
.hh-band h2 .o{color:#E3C891}
.hh-name{font-family:var(--serif);font-weight:600;font-size:1.5rem}
.hh-ico{border:1px solid rgba(227,200,145,.5);background:transparent}
.hh-band .btn{border:1px solid rgba(245,243,240,.6)}
.hh-name{border-right-color:rgba(245,243,240,.2)}

/* scrolly / misc accents (colors only) */
.scrolly .feat-list li.on{background:var(--rs-card);box-shadow:none;border-left-width:2px}
.scrolly .feat-list li{border-left-width:2px}
.scrolly .dots i{background:rgba(32,36,58,.12)}
.scrolly .step h3,.scrolly .feat-list h3{font-family:var(--serif);font-weight:600;color:var(--rs-navy)}
.sheet:nth-child(4){background:#F7F4EE}
.marquee figcaption{color:var(--rs-navy)}

/* footer */
footer{background:var(--rs-navy);color:#DAD7CF}
footer a{color:#E3C891}

/* stacking sheets: tone-on-tone neutrals, hairline edge instead of glow */
.sheet{box-shadow:0 -1px 0 var(--rs-line)}
.sheet:nth-child(1){background:#FFFDFA}
.sheet:nth-child(2){background:#F1EEE8}
.sheet:nth-child(3){background:#ECE9E3}
.sheet:nth-child(4){background:#F7F5F1}
.sheet .card{background:#FFFDFA}
.sheets a:not(.btn),.legal a:not(.btn){color:var(--rs-navy);text-decoration-color:rgba(177,138,74,.7);text-underline-offset:3px}
.sheets a:not(.btn):hover{text-decoration-color:var(--rs-navy)}

/* follow card */
#follow .follow-card{background:#FFFDFA!important;border:1px solid var(--rs-line)!important;border-radius:18px!important;box-shadow:none!important}
#follow .f-eye{font:600 .72rem var(--sans)!important;letter-spacing:.22em!important;color:var(--rs-gold-t)!important}
#follow h2{color:var(--rs-navy)!important;font-family:var(--serif);font-weight:600}
#follow p{color:var(--rs-muted)!important}
#follow a.sp{border:1px solid rgba(32,36,58,.25)!important;color:var(--rs-navy)!important;background:transparent!important;font-family:var(--sans)!important;font-weight:500!important}
#follow a.sp svg{color:var(--rs-navy)!important}
#follow a.sp:hover{background:var(--rs-navy)!important;color:#F5F3F0!important}
#follow a.sp:hover svg{color:#F5F3F0!important}
#follow .bub svg{filter:none!important}
#follow .bub svg path[fill="#6B3FA0"]{fill:var(--rs-navy)}
#follow .bub svg path[fill="#F28C28"]{fill:var(--rs-gold)}
#follow .bub svg path[fill="#FFF8EC"]{fill:#F5F3F0}
footer .social a.si{background:transparent!important;border:1px solid rgba(245,243,240,.3)!important;color:#F5F3F0!important}
footer .social a.si:hover{background:#F5F3F0!important;color:var(--rs-navy)!important;border-color:#F5F3F0!important}
footer .social .s-lbl{color:#DAD7CF!important}

/* quieter decorative pieces (motion untouched) */
#kid-mode .kid-soon,.legal .kid-soon{border:1px solid var(--rs-line)!important;background:#FFFDFA}
.mock{box-shadow:0 18px 36px rgba(32,36,58,.14)}
.mock:hover{box-shadow:0 22px 44px rgba(32,36,58,.16)}
.sticker{background:#F3EBDD;color:var(--rs-navy);font-family:var(--sans);font-weight:600;box-shadow:0 2px 0 rgba(32,36,58,.55)}
.sticker.pink{background:#EFE6E8}
.sticker.mint{background:#E3ECE7}
.sticker.lav{background:#ECE8F0}
.sticker,.sticker::after{border-width:1px}

/* raven: dark surfaces are never one flat hex. A large, low-contrast multi-stop shift
   navy -> deep blue-violet -> a breath of deep green -> navy-violet. Reads as solid navy at a glance. */
:root{
  --rs-raven:linear-gradient(118deg,#1E2236 0%,#262D4C 28%,#1C2A35 50%,#232442 72%,#2A2142 100%);
  --rs-raven-btn:linear-gradient(105deg,#1E2236 0%,#272E4E 26%,#1C2B36 50%,#2A2244 74%,#2E3452 100%);
}
.hh-band{background-image:var(--rs-raven)!important;background-color:var(--rs-navy)!important;background-size:160% 160%;background-position:0 50%}
footer{background:var(--rs-raven);background-color:var(--rs-navy);background-size:140% 140%}
a.logo::before{background:url(img/theme/crest.jpg) center/cover no-repeat}
#follow a.sp:hover{background:var(--rs-raven-btn)!important;background-color:var(--rs-navy)!important;background-size:220% 100%!important}
@media (prefers-reduced-motion:no-preference){
  .btn{transition:background-position 1.2s cubic-bezier(.2,.7,.2,1),background-color .25s,border-color .25s,transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s,filter .28s}
  .hh-band{animation:rs-raven 38s ease-in-out infinite alternate}
  @keyframes rs-raven{to{background-position:100% 50%}}
}

/* tone: product leads, Neuts are quiet supporting accents (same elements, same motion, smaller and calmer) */
.newt{width:calc(var(--w,160px)*.7);filter:drop-shadow(0 6px 8px rgba(32,36,58,.12))}
@media(max-width:700px){.newt{width:calc(var(--w,160px)*.42)}}
.hero .newt-layer img.newt.school-newt{width:clamp(120px,12vw,160px)}
.newt-runway::before{border-bottom:1px solid rgba(32,36,58,.08)}
.floaty img{filter:drop-shadow(0 6px 8px rgba(32,36,58,.12))}
.floaty.far img{filter:blur(1px) drop-shadow(0 4px 6px rgba(32,36,58,.08))}
.stage-hero .hero-visual .floaty.hero-friend img{--w:clamp(96px,10.5vw,140px)}
.hero-visual .floaty.front-s img{--w:clamp(90px,9.5vw,128px)}
@media(max-width:700px){.stage-hero .hero-visual .floaty.hero-friend img{--w:96px}.hero-visual .floaty.front-s img{--w:88px}}
.swimmer{width:72px}
.peek-newt{width:96px}
.hcard img{max-width:34%;max-height:70%}

/* release notes: shared styling only (content untouched) */
body .rn-toc{background:#FFFDFA;border:1px solid var(--rs-line);border-radius:14px}
body .rn-toc h2{color:var(--rs-gold-t);font-family:var(--sans);font-weight:600;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase}
body .rn-toc a{color:var(--rs-navy)}
body .rn-card{border:1px solid var(--rs-line);border-radius:14px;box-shadow:none}
body .rn-head{border-bottom-color:var(--rs-line)}
body .rn-head h2{color:var(--rs-navy)}
body .rn-badge{background:var(--rs-raven-btn);background-color:var(--rs-navy);color:#F5F3F0;font-family:var(--sans)}

/* precision pass: one hairline weight, one radius, one tracking, 8px spacing scale */
:root{--rs-weave:repeating-linear-gradient(90deg,rgba(32,36,58,.022) 0 1px,transparent 1px 4px),repeating-linear-gradient(0deg,rgba(32,36,58,.014) 0 1px,transparent 1px 4px);--rs-hair:1px solid rgba(32,36,58,.24);--rs-r:14px}
.btn.ghost,nav .nav-contact,nav a.nav-contact,#follow a.sp{border:var(--rs-hair)!important}
.hc-go,.store-pill{border:1px solid var(--rs-line)}
.card,.hcard,.store-pill+.store-pill{border-radius:var(--rs-r)}
#follow .follow-card{border-radius:var(--rs-r)!important}
body .rn-toc,body .rn-card{border-radius:var(--rs-r)}
.hcard,.hero-cards .hcard:nth-child(2),.hero-cards .hcard:nth-child(3){border-top-width:2px}
.eyebrow,.hero-copy .eyebrow,#follow .f-eye,body .rn-toc h2{font-size:.74rem!important;letter-spacing:.2em!important;font-weight:600!important}
.stage-hero .hero-copy .eyebrow{margin-bottom:16px}
.stage-hero h1{margin-bottom:24px}
.stage-hero .lede{margin-bottom:32px}
.hero-cards{gap:24px;margin-top:24px}
.hcard h3{font-size:1.34rem;line-height:1.15;margin-bottom:8px}
.hcard .hc-txt p{font-size:.94rem;line-height:1.55}

/* What's new: homepage teaser + release notes (Apple-style) */
#whats-new{padding:40px 24px}
#whats-new .wn{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;background:#FFFDFA;border:1px solid var(--rs-line);border-top:2px solid var(--rs-gold);border-radius:var(--rs-r);padding:24px 32px}
#whats-new .wn-ver{font:600 1.5rem var(--serif);color:var(--rs-navy);margin:4px 0 0;line-height:1.1}
#whats-new .wn-date{font:500 .82rem var(--sans);color:var(--muted);margin-top:4px;display:block}
#whats-new .wn-txt{margin:0;color:var(--ink);font-size:1rem;line-height:1.55;max-width:46em}
#whats-new .wn-txt b{color:var(--rs-navy)}
#whats-new .btn{white-space:nowrap}
@media(max-width:760px){#whats-new .wn{grid-template-columns:1fr;gap:16px;padding:24px}}
body .rn-head h2{font-family:var(--serif)!important;font-weight:600;font-size:1.9rem;letter-spacing:0;line-height:1.1}
body .rn-head time{font-family:var(--sans);color:var(--muted);font-size:.86rem}
body .rn-group h3{font:600 .74rem var(--sans)!important;letter-spacing:.2em!important;text-transform:uppercase;color:var(--rs-gold-t)!important}
body .rn-group li{line-height:1.6;color:var(--ink)}
body .rn-card#mach8a01{border-top:2px solid var(--rs-gold)}
body .rn-card{background:#FFFDFA}

.help-wn{margin:0 0 24px;color:var(--ink)}.help-wn a{color:var(--rs-navy);text-decoration:underline;text-decoration-color:var(--rs-gold);text-underline-offset:3px}
#whats-new .wn-ver,body .rn-head h2,body .rn-toc a{font-variant-numeric:lining-nums}
body main>h1,body .rn-wrap>h1,body.rn h1{font-size:clamp(2.2rem,4vw,3rem)}
#whats-new .eyebrow,.help-wn .eyebrow{display:block;position:static;text-align:left;margin:0 0 8px;transform:none}
/* Start here: two steps, balanced */
#start-here .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#start-here .steps>li{border:1px solid var(--rs-line);border-radius:var(--rs-r);background:#FFFDFA}
#start-here .steps>li::before{background:var(--rs-raven-btn);background-color:var(--rs-navy);color:#F5F3F0;font-family:var(--sans);font-weight:600}
#start-here .steps a{color:var(--rs-navy);display:inline-block;margin-top:16px}
#start-here .steps h3{font-size:1.3rem;color:var(--rs-navy)}
#start-here .steps .mini{background:#F8F6F2;border-color:var(--rs-line)}
@media(max-width:760px){#start-here .steps{grid-template-columns:1fr;gap:16px}}
/* ---- Tester elements: keep their original look ---- */
#tester-banner,#tester-cta,#testers{
  --cream:#F1F0F7;--stone:#ECEBF4;--ink:#2B2350;--navy:#1F2A5C;--purple:#5B3A99;--muted:#544B6B;
  --orange:#A84B07;--orange-hi:#F28C28;--orange-soft:#FFB870;--lav:#F4EFFB;--lav2:#E8DFF7;--lav3:#CFC2EC;
  --serif:Georgia,"Times New Roman",serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --rest:0 2px 8px rgba(46,35,64,.07);--lift:0 14px 34px rgba(46,35,64,.16),0 3px 8px rgba(46,35,64,.08);
}
#tester-cta h2,#testers h2,#testers h3{font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:-.01em}
#testers h2,#testers h3{color:var(--ink)}
#testers .o{color:var(--orange);font-style:normal}
#testers .eyebrow{font:700 .8rem var(--sans);letter-spacing:.14em;color:var(--orange)}
#testers .card{background:#fff;border:1px solid #E8DFF7;border-radius:20px;box-shadow:0 4px 18px rgba(43,35,80,.06)}
#testers .btn{background:#A84B07;color:#fff!important;font-family:var(--sans);font-weight:700;letter-spacing:normal;box-shadow:0 6px 16px rgba(185,83,9,.22)}
#testers .btn:hover{background:#A84B07;box-shadow:0 12px 26px rgba(242,140,40,.38);filter:saturate(1.08)}
#testers .btn.ghost{background:#fff;border:1.5px solid #CFC2EC;color:#2B2350!important;box-shadow:none}
#testers .btn.alt{background:#5B3A99}
#tester-banner,#tester-cta,#testers{font-family:var(--sans)}
/* top tester banner background only: navy blend, no purple */
#tester-banner{background:radial-gradient(ellipse at 85% 0,rgba(46,60,122,.6),transparent 60%),linear-gradient(100deg,#151A33,#1B2350 60%,#242A45)!important;background-size:100% 160px!important;background-position:center 45%!important}
/* background weave only: real tartan sett (uneven bands + fine threads) instead of a flat grid */
:root{--rs-weave:repeating-linear-gradient(90deg,transparent 0 22px,rgba(32,36,58,.045) 22px 58px,transparent 58px 64px,rgba(177,138,74,.09) 64px 66px,transparent 66px 72px,rgba(32,36,58,.03) 72px 84px,transparent 84px 120px,rgba(32,36,58,.05) 120px 122px,transparent 122px 144px),repeating-linear-gradient(0deg,transparent 0 22px,rgba(32,36,58,.04) 22px 58px,transparent 58px 64px,rgba(177,138,74,.08) 64px 66px,transparent 66px 72px,rgba(32,36,58,.028) 72px 84px,transparent 84px 120px,rgba(32,36,58,.045) 120px 122px,transparent 122px 144px),repeating-linear-gradient(45deg,rgba(32,36,58,.018) 0 1px,transparent 1px 3px)}
