/*
Theme Name: CoreAllure
Theme URI: https://coreallure.org
Author: Lyndon Davis
Author URI: https://coreallure.org
Description: Voice-first dating. Editorial theme for CoreAllure, built for Rank Math, Core Web Vitals and real product photography.
Version: 1.10.2
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: coreallure
Tags: blog, one-column, custom-logo, custom-menu, featured-images, block-patterns, editor-style, translation-ready
*/

:root{
--cream:#FBF7F2;--cream2:#F7F1E9;--white:#FFFFFF;
--ink:#1D1B22;--body:#4A4750;--muted:#7C7783;
--lav:#8B73C6;--lav-d:#735CB3;--lav-s:#EDE7F8;--lav-l:#B9A5DC;
--peach:#FFB47D;--coral:#FF7B76;--pink:#EE83C5;--blush:#FBE9E4;
--line:#EBE4DB;--line2:#E7E0EC;
--serif:'Playfair Display',Georgia,serif;
--sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--pad:clamp(20px,5vw,64px);
}
*{box-sizing:border-box}
html{overflow-x:clip}
body{margin:0;max-width:100%;overflow-x:clip;background:var(--cream);color:var(--body);font-family:var(--sans);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.ser{font-family:var(--serif);color:var(--ink);font-weight:400;line-height:1.08;letter-spacing:-.015em;margin:0}
p{margin:0 0 1.15em}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:1220px;margin:0 auto;padding:0 var(--pad)}
section{padding:clamp(72px,9vw,124px) 0}
.d1{font-size:clamp(44px,6.4vw,80px);line-height:1.02}
.d2{font-size:clamp(34px,4.4vw,58px)}
.h2{font-size:clamp(28px,3.2vw,42px)}
.h3{font-size:clamp(22px,2vw,27px)}
.lead{font-size:clamp(17px,1.5vw,19px);color:var(--body);max-width:52ch}
.sm{font-size:14.5px;color:var(--muted);line-height:1.62}
.kick{font-size:11.5px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--lav)}
.rule{height:2px;width:64px;background:var(--lav-l);border-radius:2px;margin:22px 0 30px}
hr.h{border:0;height:1px;background:var(--line);margin:0}
.two{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,5vw,80px);align-items:center}
@media(max-width:900px){.two{grid-template-columns:1fr;gap:44px}}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-size:15px;font-weight:500;color:#fff;background:var(--lav);padding:15px 30px;border-radius:12px;border:0;text-decoration:none;cursor:pointer;transition:background .25s ease,transform .25s ease}
.btn:hover{background:var(--lav-d);transform:translateY(-1px)}
.btn-soft{background:var(--lav-l)}
.btn-soft:hover{background:var(--lav)}
.btn-o{background:transparent;color:var(--lav-d);border:1px solid var(--line2)}
.btn-o:hover{background:var(--lav-s);color:var(--lav-d)}
.pill{border-radius:999px;padding:13px 26px;font-size:14.5px}
.btn:focus-visible{outline:2px solid var(--lav-d);outline-offset:3px}
.tl{display:inline-flex;align-items:center;gap:8px;color:var(--lav-d);font-weight:500;font-size:15px;text-decoration:none}
.tl:hover{gap:12px}
.card{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:clamp(24px,2.6vw,34px)}
.card h3{margin-bottom:10px}
.ic{width:52px;height:52px;border-radius:50%;background:var(--lav-s);display:grid;place-items:center;margin-bottom:20px}
.ic.peachy{background:#FDEADF}
.ic svg{width:24px;height:24px;stroke:var(--lav-d);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.ic.peachy svg{stroke:#E08A54}
/* orb */
.orbwrap{position:relative;display:grid;place-items:center;min-height:320px}
.orb{position:relative;z-index:2;width:min(400px,78vw);aspect-ratio:1/1;border-radius:50%;
background:radial-gradient(circle at 32% 26%,#FFFFFF 0%,#FFE3CB 22%,#FBCBB4 40%,#E7C4E0 62%,#C3AEE6 82%,#B9A5DC 100%);
filter:blur(.4px);box-shadow:0 60px 90px -60px rgba(139,115,198,.55)}
.orb.sm{width:min(230px,52vw)}
.orb.tiny{width:120px}
.orb.cool{background:radial-gradient(circle at 34% 28%,#FFFFFF,#E4D7F5 26%,#C9B3E8 48%,#F2CDBE 78%,#FFD9BE 100%)}
.waves{position:absolute;inset:0;z-index:1;overflow:visible;pointer-events:none}
.waves path{fill:none;stroke:rgba(139,115,198,.28);stroke-width:1}
.waves path.warm{stroke:rgba(255,150,120,.22)}
/* nav */
.site{position:sticky;top:0;z-index:70;background:var(--cream);border-bottom:1px solid var(--line)}
.site .wrap{display:flex;align-items:center;justify-content:space-between;height:80px;gap:24px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo img{width:42px;height:42px}
.logo span{font-family:var(--serif);font-size:27px;color:var(--ink);letter-spacing:-.01em}
.logo span i{font-style:normal;color:var(--lav)}
.nav{display:flex;gap:34px}
.nav a{font-size:15px;color:var(--body);text-decoration:none;padding-bottom:4px}
.nav a.on{color:var(--ink);border-bottom:1.5px solid var(--lav)}
@media(max-width:980px){.nav{display:none}.site .btn.pill{display:none}}

/* menu orb + full screen sheet */
.menuorb{display:none;width:62px;height:62px;border-radius:50%;border:0;cursor:pointer;place-items:center;position:relative;z-index:130;
background:radial-gradient(circle at 36% 30%,#FFFFFF 0%,#FFDCC2 24%,#F2C3DF 52%,#C6B0E7 86%);
box-shadow:0 8px 18px -10px rgba(139,115,198,.6),0 0 0 4px rgba(199,178,230,.14);
font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ink);
transition:transform .3s ease,box-shadow .3s ease}
.menuorb:hover{transform:scale(1.04)}
.menuorb:focus-visible{outline:2px solid var(--lav-d);outline-offset:4px}
@media(max-width:980px){.menuorb{display:grid;width:54px;height:54px;font-size:10px}}
@media(max-width:560px){.site .wrap{height:72px}.menuorb{width:50px;height:50px;font-size:9.5px;letter-spacing:.12em}}
.sheet{position:fixed;inset:0;z-index:120;background:var(--cream);display:none;flex-direction:column;align-items:center;justify-content:center;
padding:96px 24px 40px;overflow-y:auto;text-align:center}
.sheet.on{display:flex}
.sheet::before{content:"";position:absolute;left:50%;top:18%;width:min(760px,150vw);height:60%;transform:translateX(-50%);pointer-events:none;
background:radial-gradient(38% 40% at 50% 30%,rgba(255,196,150,.4),transparent 70%),radial-gradient(44% 44% at 60% 60%,rgba(198,170,235,.4),transparent 72%);filter:blur(30px)}
.sheet>*{position:relative;z-index:2}
.sheet .mark{width:92px;height:92px;margin-bottom:clamp(30px,6vh,58px);filter:drop-shadow(0 18px 34px rgba(139,115,198,.55))}
.sheet nav{display:flex;flex-direction:column;gap:clamp(4px,1.4vh,12px);width:100%;max-width:420px}
.sheet nav a{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:baseline;
font-family:var(--serif);font-size:clamp(32px,8.5vw,46px);color:var(--ink);text-decoration:none;padding:8px 0;border:0;line-height:1.1;
transition:color .2s ease,transform .25s ease}
.sheet nav a .n{grid-column:1;justify-self:end;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--lav);text-align:right;line-height:1}
.sheet nav a:hover{color:var(--lav-d)}
.sheet nav a.on{color:var(--lav-d)}
.sheet nav a.on .n{color:var(--lav-d)}
.sheet .legal{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin:clamp(30px,6vh,54px) 0 clamp(24px,4vh,38px)}
.sheet .legal a{font-size:14px;color:var(--muted);text-decoration:none}
.sheet .legal a:hover{color:var(--lav-d)}
.sheet .btn{padding:16px 40px;border-radius:999px;font-size:16px}
.mframe{width:390px;max-width:100%;border:1px solid var(--line);border-radius:40px;overflow:hidden;background:var(--cream);box-shadow:0 40px 80px -50px rgba(139,115,198,.6)}
.mframe .sheet{position:static;display:flex;min-height:640px;padding:22px 20px 30px}
.mframe .mhdr{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line)}
.mlab{font-size:11.5px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--muted);margin-bottom:18px;text-align:center}

/* device + hero */
/* ==========================================================================
   Device: black titanium.
   Four layers, like the real thing: metal band, black inner rim, screen,
   glass reflection. Everything is a percentage of the frame width, so the
   corners stay true at any size. Percentage padding always resolves against
   width, which is what keeps the radii from going oval.
   ========================================================================== */
.dev{position:relative;width:var(--w,min(292px,70vw));padding:calc(var(--w,292px) * .0115);
  border-radius:calc(var(--w,292px) * .156);
  background:linear-gradient(133deg,#6a6a70 0%,#26262a 10%,#83838b 19%,#1c1c1f 32%,#6e6e75 44%,
    #202024 56%,#5f5f66 70%,#232327 82%,#7a7a82 92%,#2a2a2e 100%);
  box-shadow:0 1px 1px rgba(255,255,255,.22) inset,
             0 22px 26px -22px rgba(30,25,45,.7),
             0 64px 90px -54px rgba(90,70,130,.6)}
.dev-rim{display:block;padding:calc(var(--w,292px) * .0112);border-radius:calc(var(--w,292px) * .1445);background:#08080A}
.dev-screen{display:block;position:relative;aspect-ratio:760/1642;overflow:hidden;background:#000;
  border-radius:calc(var(--w,292px) * .1333)}
.dev-screen img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.dev-island{display:block;position:absolute;left:50%;top:2.5%;transform:translateX(-50%);z-index:3;
  width:29.5%;aspect-ratio:3.6/1;border-radius:999px;background:#000}
.dev-glass{display:block;position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(104deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.03) 14%,
    transparent 34%,transparent 78%,rgba(255,255,255,.02) 94%,rgba(255,255,255,.06) 100%)}
.dev-k{display:block;position:absolute;z-index:4;
  width:calc(var(--w,292px) * .010);border-radius:calc(var(--w,292px) * .003);
  background:linear-gradient(180deg,#54545b,#2b2b30 42%,#4a4a51)}
.dev-k.l{left:calc(var(--w,292px) * -.003)}
.dev-k.r{right:calc(var(--w,292px) * -.003)}
.dev-k1{top:15.5%;height:3.6%}
.dev-k2{top:22%;height:7.4%}
.dev-k3{top:31%;height:7.4%}
.dev-k4{top:24%;height:11%}
@media (prefers-reduced-motion:no-preference){.dev{transition:transform .4s ease}}
/* Two devices together, identical everywhere they appear. */
.devpair{display:flex;justify-content:center;align-items:flex-start}
.devpair .a{--w:min(272px,52vw);position:relative;z-index:3;margin-right:-46px}
.devpair .b{--w:min(226px,43vw);position:relative;z-index:2;margin-top:66px}
.hero{position:relative;overflow:hidden;padding:clamp(48px,6vw,84px) 0 clamp(38px,4.5vw,58px)}
.hero::before{content:"";position:absolute;left:50%;top:-14%;width:min(1200px,120vw);height:120%;transform:translateX(-38%);
background:radial-gradient(42% 44% at 62% 40%,rgba(255,196,150,.42),transparent 68%),radial-gradient(46% 46% at 78% 62%,rgba(198,170,235,.42),transparent 70%),radial-gradient(30% 30% at 50% 20%,rgba(238,131,197,.22),transparent 70%);
filter:blur(26px);pointer-events:none}
.hero .wrap{position:relative}
.herogrid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(30px,4vw,64px);align-items:center}
@media(max-width:980px){.herogrid{grid-template-columns:1fr;gap:52px}}
.stack{position:relative;display:flex;justify-content:center;align-items:flex-start;min-height:auto}
.stack .front{--w:min(272px,52vw);position:relative;z-index:3;margin-right:-46px;animation:float 9s ease-in-out infinite}
.stack .back{--w:min(226px,43vw);position:relative;z-index:2;margin-top:66px;animation:float 9s ease-in-out infinite}
@media(max-width:1100px){.stack .front{margin-right:-44px}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hnote{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;color:var(--muted);margin-top:26px}
.hnote i{width:6px;height:6px;border-radius:50%;background:var(--lav-l);display:inline-block}
/* sequence gallery */
.seq{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px)}
@media(max-width:1080px){.seq{grid-template-columns:1fr 1fr;gap:38px}}
@media(max-width:520px){.seq{grid-template-columns:1fr}}
.seq figure{margin:0}
.seq .dev{--w:min(292px,100%);margin-left:auto;margin-right:auto;margin-bottom:22px}
.seq .n{font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--lav);display:block;margin-bottom:8px}
.seq h3{font-size:21px;margin-bottom:8px}
.seq p{font-size:14.5px;color:var(--muted);margin:0;line-height:1.6}
/* reveal moment */
.moment{position:relative;overflow:hidden;text-align:center}
.moment::before{content:"";position:absolute;left:50%;bottom:-30%;width:min(1000px,140vw);height:80%;transform:translateX(-50%);
background:radial-gradient(45% 55% at 50% 50%,rgba(255,190,140,.30),rgba(238,131,197,.17) 46%,rgba(160,130,220,.15) 72%,transparent);filter:blur(40px);pointer-events:none}
.moment .wrap{position:relative}
.pquote{font-family:var(--serif);font-size:clamp(22px,2.4vw,28px);color:var(--ink);border-left:2px solid var(--lav-l);padding-left:24px;margin:30px 0 0}


/* store badges */
.stores{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.store{display:inline-flex;align-items:center;gap:11px;height:56px;padding:0 20px 0 17px;background:#000;color:#fff;border-radius:9px;text-decoration:none;
transition:transform .25s ease,box-shadow .25s ease;box-shadow:0 12px 28px -18px rgba(0,0,0,.9)}
.store:hover{transform:translateY(-2px);box-shadow:0 18px 34px -18px rgba(0,0,0,.95)}
.store:focus-visible{outline:2px solid var(--lav);outline-offset:3px}
.store svg{flex:none}
.store .t{display:flex;flex-direction:column;justify-content:center;line-height:1.05}
.store .t small{font-size:11px;font-weight:400;letter-spacing:.01em;color:#fff;white-space:nowrap}
.store .t b{font-size:20px;font-weight:600;letter-spacing:-.02em;white-space:nowrap;margin-top:2px;color:#fff}
.store.gp .t small{font-size:10px;font-weight:500;letter-spacing:.09em;text-transform:uppercase}
.store.sm{height:46px;padding:0 16px 0 14px;gap:9px;border-radius:8px}
.store.sm svg{width:20px;height:23px}
.store.sm .t small{font-size:9.5px}
.store.sm .t b{font-size:16px}
.store.sm.gp .t small{font-size:8.5px}
.storesnote{font-size:13px;color:var(--muted);margin-top:16px;display:flex;align-items:center;gap:9px}
.storesnote i{width:6px;height:6px;border-radius:50%;background:var(--lav-l);display:inline-block;flex:none}

/* home trio */
.trio{border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.5);padding:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.trio .card{border-color:var(--line);box-shadow:none}
@media(max-width:860px){.trio{grid-template-columns:1fr}}
/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.steps div{padding:30px 26px 0 0;border-top:1px solid var(--line)}
.steps .n{font-family:var(--serif);font-size:15px;color:var(--lav);display:block;margin-bottom:14px}
.steps h3{font-size:23px;margin-bottom:8px}
@media(max-width:860px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
/* voice card */
.wave{display:flex;align-items:center;gap:4px;height:56px}
.wave i{width:5px;border-radius:3px;background:linear-gradient(180deg,var(--peach),var(--pink),var(--lav));opacity:.85}
.reads{display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid var(--line);border-radius:12px;padding:13px 18px;margin-top:22px;background:var(--cream)}
.reads b{font-size:10.5px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--muted)}
.reads i{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--lav-d)}
/* values */
.vals{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.vals .card{text-align:center;padding:30px 20px}
.vals .ic{margin:0 auto 16px;width:46px;height:46px}
.vals h3{font-size:19px}
.vals-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.vals{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.vals{grid-template-columns:1fr 1fr}}
/* blog */
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:900px){.bgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.bgrid{grid-template-columns:1fr}}
.post{background:var(--white);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.art-img{aspect-ratio:16/9;background:linear-gradient(160deg,#FCEDE7,#F7E3E6);position:relative;overflow:hidden}
.art-img .s1,.art-img .s2{position:absolute;border-radius:50%}
.art-img .s1{width:44%;aspect-ratio:1;right:12%;top:14%;background:radial-gradient(circle at 34% 28%,#fff,#FFD9C0 34%,#F0B79B 74%,#DFA184)}
.art-img .s2{width:26%;aspect-ratio:1;left:16%;bottom:8%;background:radial-gradient(circle at 34% 28%,#fff,#E7D8F5 44%,#C7B2E6);opacity:.9}
.post .body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.tag{display:inline-block;font-size:12.5px;color:var(--lav-d);background:var(--lav-s);border-radius:999px;padding:5px 14px;margin-bottom:14px;align-self:flex-start}
.tag.b{background:var(--blush);color:#B4685F}
.post h3{font-size:24px;line-height:1.2;margin-bottom:10px}
.post .date{font-size:13.5px;color:var(--muted);margin-top:auto;padding-top:14px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0 44px}
.chips a{font-size:14px;text-decoration:none;color:var(--body);border:1px solid var(--line);background:var(--white);border-radius:999px;padding:9px 20px}
.chips a.on{background:var(--lav);color:#fff;border-color:var(--lav)}
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:52px}
.pager a{min-width:40px;height:40px;display:grid;place-items:center;border-radius:10px;text-decoration:none;color:var(--body);font-size:14.5px;border:1px solid transparent}
.pager a.on{border-color:var(--lav);color:var(--lav-d)}
.pager a.nav{border-color:var(--line);background:var(--white)}
/* article */
.art{max-width:730px;margin:0 auto}
.art p,.art li{font-size:18.5px;line-height:1.82;color:var(--body)}
.art h2{font-size:clamp(27px,3vw,36px);margin:52px 0 16px}
.art h3{font-size:24px;margin:38px 0 10px}
.quote{font-family:var(--serif);font-size:clamp(23px,2.6vw,30px);line-height:1.36;color:var(--ink);border-left:2px solid var(--lav-l);padding-left:28px;margin:44px 0}
.meta{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--muted);margin-top:20px}
/* forms */
.f label{display:block;font-size:14.5px;font-weight:500;color:var(--ink);margin-bottom:8px}
.f input,.f select,.f textarea{width:100%;border:1px solid var(--line2);border-radius:10px;background:var(--white);font-family:var(--sans);font-size:16px;color:var(--ink);padding:14px 16px}
.f input:focus,.f select:focus,.f textarea:focus{outline:0;border-color:var(--lav)}
.f .row{margin-bottom:20px}
/* legal */
.legal{display:grid;grid-template-columns:262px 1fr;gap:clamp(30px,5vw,72px);align-items:start}
@media(max-width:900px){.legal{grid-template-columns:1fr}}
.toc{position:sticky;top:160px;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:26px}
.toc ol{list-style:none;margin:16px 0 0;padding:0;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:block;padding:9px 0;font-size:14.5px;color:var(--body);text-decoration:none;border-bottom:1px solid var(--line)}
.toc li:last-child a{border-bottom:0}
.toc a::before{content:counter(t,decimal-leading-zero);font-size:11.5px;color:var(--lav);margin-right:12px}
.lb{max-width:70ch}
.lb h2{font-size:clamp(25px,2.6vw,33px);margin:52px 0 14px;scroll-margin-top:150px}
.lb h2:first-child{margin-top:0}
.lb h3{font-size:21px;margin:30px 0 8px}
.lb p,.lb li{font-size:16.5px;line-height:1.8}
.slot{border:1px dashed #D9CFE6;background:var(--lav-s);border-radius:12px;padding:18px 20px;font-size:14px;color:var(--muted);margin:12px 0}
.slot b{display:block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--lav-d);margin-bottom:6px}
/* bands */
.band{background:var(--cream2)}
.note{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--line);background:var(--white);border-radius:16px;padding:26px 30px}
.note svg{width:26px;height:26px;stroke:var(--lav);fill:none;stroke-width:1.3;flex:none;margin-top:3px}
.tv{display:inline-block;font-size:9.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#B4685F;background:var(--blush);border-radius:999px;padding:3px 10px;margin-left:8px;vertical-align:middle}
/* footer */
.ftr{border-top:1px solid var(--line);padding:70px 0 34px;background:var(--cream)}
.fcols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:40px}
@media(max-width:1080px){.fcols{grid-template-columns:1.4fr 1fr 1fr;row-gap:44px}}
@media(max-width:720px){.fcols{grid-template-columns:1fr 1fr}}
.ftr h4{font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.ftr a{font-size:15px;color:var(--body);text-decoration:none}
.ftr a:hover{color:var(--lav-d)}
.fbase{margin-top:56px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
.arthead{text-align:center;max-width:860px;margin:0 auto}
.arthead .kick{display:block;margin-bottom:18px}
.arthead .meta{justify-content:center;margin-top:16px}
/* ---------- Quick Answer ----------------------------------------------------
   The opening paragraph of an article, rebuilt in PHP into a highlighted panel
   with a lavender edge and an inline uppercase label. Works whether the article
   bolds only the label, the whole block, or nothing at all. */
.entry p.quick-answer,.art p.quick-answer,.lb p.quick-answer{
  position:relative;
  background:linear-gradient(160deg,#FFFFFF 0%,#FBF8FF 100%);
  border:1px solid #DFD5F0;
  border-radius:18px;
  padding:clamp(26px,3vw,34px);
  margin:8px 0 44px;
  font-size:clamp(17px,1.7vw,18.5px);
  line-height:1.74;
  font-weight:400;
  color:var(--ink);
  box-shadow:0 0 0 5px rgba(139,115,198,.06),0 30px 60px -46px rgba(139,115,198,.65);
}
.entry p.quick-answer .qa-label,.art p.quick-answer .qa-label,.lb p.quick-answer .qa-label{
  font-family:var(--sans);
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--lav-d);
  margin-right:11px;
  white-space:nowrap;
}
.entry p.quick-answer strong,.art p.quick-answer strong{font-weight:400;color:inherit}
.entry p.quick-answer a,.art p.quick-answer a{color:var(--lav-d)}
.topics{margin:44px 0 0}
.topics a{color:var(--lav-d);text-decoration:none;font-size:15.5px}
.topics a:hover{text-decoration:underline}
.ctaband{background:var(--lav-s);border:1px solid var(--line2);border-radius:18px;padding:clamp(34px,4vw,52px);text-align:center;margin-top:56px}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:8px 0}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-family:var(--serif);font-size:22px;color:var(--ink);display:flex;justify-content:space-between;gap:20px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--lav);font-family:var(--sans);font-size:22px}
.faq details[open] summary::after{content:"–"}
.faq p{margin:0 0 18px;font-size:17px}
.photo{position:relative;border-radius:16px;overflow:hidden;background:linear-gradient(150deg,#F6E9E2,#EFE0EC 55%,#E6DCF3)}
.photo .cap{position:absolute;right:14px;bottom:12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(74,71,80,.5)}
.tip{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:clamp(24px,2.4vw,32px)}
.tip .n{font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--lav);display:block;margin-bottom:12px}
.tip h3{font-size:24px;margin-bottom:10px}
.tip p{margin:0;font-size:15.5px;line-height:1.65}
.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:960px){.tips{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tips{grid-template-columns:1fr}}
.emg{background:#FDF0E8;border:1px solid #F3DCCE;border-left:3px solid var(--coral);border-radius:16px;padding:clamp(26px,3vw,38px)}
.emg h2{font-size:22px;display:flex;align-items:center;gap:12px}
.emg .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px}
@media(max-width:760px){.emg .grid{grid-template-columns:1fr}}
.emg .num{font-family:var(--serif);font-size:26px;color:var(--ink);display:block;margin-top:4px}
.flags{display:grid;grid-template-columns:repeat(3,1fr);gap:0 30px}
@media(max-width:900px){.flags{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.flags{grid-template-columns:1fr}}
.flags li{list-style:none;padding:15px 0 15px 30px;border-bottom:1px solid var(--line);position:relative;font-size:15.5px}
.flags li::before{content:"";position:absolute;left:0;top:22px;width:11px;height:11px;border-radius:3px;border:1.5px solid var(--coral);opacity:.7}
.pol{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
@media(max-width:760px){.pol{grid-template-columns:1fr}}
.pol a{display:block;text-decoration:none;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:22px 24px}
.pol a:hover{border-color:var(--lav-l)}
.pol .t{font-family:var(--serif);font-size:21px;color:var(--ink)}
.it{font-style:italic;color:var(--lav)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- WordPress core ---------- */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{position:fixed;top:12px;left:12px;z-index:200;width:auto;height:auto;clip:auto;background:var(--ink);color:#fff;padding:12px 20px;border-radius:10px}
.alignwide{max-width:1180px;margin-left:auto;margin-right:auto}
.alignfull{max-width:none}
.aligncenter{display:block;margin-left:auto;margin-right:auto}
.alignleft{float:left;margin:6px 28px 20px 0}
.alignright{float:right;margin:6px 0 20px 28px}
.wp-caption{max-width:100%}
.wp-caption-text,figcaption{font-size:13.5px;color:var(--muted);margin-top:10px}
.wp-block-quote{border-left:2px solid var(--lav-l);padding-left:26px;margin:44px 0;font-family:var(--serif);font-size:clamp(23px,2.6vw,30px);line-height:1.36;color:var(--ink)}
.wp-block-quote p{margin:0}
.wp-block-details{border-bottom:1px solid var(--line);padding:8px 0}
.wp-block-details summary{cursor:pointer;padding:18px 0;font-family:var(--serif);font-size:22px;color:var(--ink);list-style:none}
.wp-block-details summary::-webkit-details-marker{display:none}
.wp-block-table td,.wp-block-table th{border:1px solid var(--line);padding:12px 14px}
.wp-block-button__link{background:var(--lav);border-radius:12px;padding:15px 30px;font-weight:500}
.pagination{margin-top:52px}
/* WordPress wraps the page numbers in .nav-links, so the flex container has to
   be that element rather than the outer nav. Without this the numbers are
   block-level grid boxes in a plain div and stack vertically. */
.pagination .nav-links{display:flex;gap:6px;justify-content:center;align-items:center;flex-wrap:wrap}
.pagination .page-numbers{min-width:40px;height:40px;display:grid;place-items:center;border-radius:10px;text-decoration:none;color:var(--body);font-size:14.5px;border:1px solid transparent;padding:0 12px}
.pagination .current{border-color:var(--lav);color:var(--lav-d)}
.pagination .next,.pagination .prev{border-color:var(--line);background:var(--white)}
.pagination .dots{min-width:20px;padding:0 2px;color:var(--muted);border:0}
@media(max-width:560px){
	.pagination .nav-links{gap:4px}
	.pagination .page-numbers{min-width:34px;height:34px;font-size:14px;padding:0 8px}
	.pagination .dots{min-width:16px;padding:0}
}
.notice{border-radius:14px;padding:16px 20px;margin-bottom:24px;font-size:15px}
.notice.ok{background:#EDF7F0;border:1px solid #CBE6D5;color:#2A6B44}
.notice.err{background:#FDF0F0;border:1px solid #F0D2D2;color:#9A3A45}
.f .hp{position:absolute!important;left:-9999px}
.admin-bar .site{top:32px}
.admin-bar .sheet{top:32px}
@media(max-width:782px){.admin-bar .site,.admin-bar .sheet{top:46px}}
.entry{max-width:730px;margin:0 auto}
.entry p,.entry li{font-size:18.5px;line-height:1.82;color:var(--body)}
.entry h2{font-size:clamp(27px,3vw,38px);margin:52px 0 16px}
.entry h3{font-size:26px;margin:38px 0 10px}
.entry ul,.entry ol{padding-left:22px}
.entry a{color:var(--lav-d)}
.searchform{display:flex;gap:10px;max-width:440px}
.searchform input[type=search]{flex:1;border:1px solid var(--line2);border-radius:10px;padding:13px 16px;font-family:var(--sans);font-size:15px;background:var(--white)}
.nores{padding:40px 0}

/* ---------- Images never distort ---------- */
.art-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.post .art-img{position:relative;overflow:hidden}
.photo img,.entry img,.art img{display:block;max-width:100%;height:auto}
.dev img{height:auto}

/* ---------- Footer badges keep their own colours ---------- */
.ftr .store,.ftr .store:hover,.ftr .store .t b,.ftr .store .t small{color:#fff}
.ftr .stores{gap:12px}

/* ---------- Blog cards ---------- */
.post{transition:transform .25s ease,box-shadow .25s ease}
.post:hover{transform:translateY(-3px);box-shadow:0 26px 50px -40px rgba(139,115,198,.85)}
.post a{text-decoration:none}
.post .tag{text-decoration:none}
.post h3 a{color:var(--ink)}
.post h3 a:hover{color:var(--lav-d)}
.post .body .sm{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.readmore{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:500;color:var(--lav-d);margin-left:auto}
.post .date{display:flex;align-items:center;justify-content:space-between;gap:16px}

/* ---------- Featured post ---------- */
.featured{display:grid;grid-template-columns:1.02fr .98fr;background:var(--white);border:1px solid var(--line);
  border-radius:20px;overflow:hidden;margin-bottom:clamp(24px,3vw,34px);text-decoration:none;
  transition:transform .25s ease,box-shadow .25s ease}
.featured:hover{transform:translateY(-3px);box-shadow:0 30px 60px -44px rgba(139,115,198,.9)}
.featured .fbody{padding:clamp(28px,3.6vw,52px);display:flex;flex-direction:column;justify-content:center}
.featured .fbody .tag{align-self:flex-start}
.featured h2{font-family:var(--serif);font-size:clamp(28px,3.2vw,40px);line-height:1.14;color:var(--ink);margin:14px 0 14px}
.featured .sm{font-size:16px;max-width:46ch}
.featured .meta{font-size:13.5px;color:var(--muted);margin:18px 0 0}
.featured .fimage{background-size:cover;background-position:center 35%;min-height:340px}
.featured .fimage.placeholder{background:linear-gradient(160deg,#FCEDE7,#F0E4F7)}
@media(max-width:860px){.featured{grid-template-columns:1fr}.featured .fimage{min-height:220px;order:-1}}

/* ---------- Comments ---------- */
.comments{margin-top:64px;padding-top:40px;border-top:1px solid var(--line)}
.comments h2,.comment-reply-title{font-family:var(--serif);font-size:28px;color:var(--ink);margin:0 0 20px;font-weight:400}
.commentlist{list-style:none;margin:0 0 40px;padding:0}
.commentlist li{border-bottom:1px solid var(--line);padding:22px 0}
.commentlist .children{list-style:none;margin:14px 0 0 26px;padding:0;border-left:1px solid var(--line)}
.commentlist .children li{padding-left:22px;border-bottom:0}
.comment-meta{font-size:13.5px;color:var(--muted);margin-bottom:8px}
.comment-author img{border-radius:50%;vertical-align:middle;margin-right:10px}
.comment-content p{font-size:16.5px;line-height:1.7}
.comment-respond{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:clamp(24px,3vw,36px)}
.comment-form p{margin-bottom:18px}
.comment-form label{display:block;font-size:14.5px;font-weight:500;color:var(--ink);margin-bottom:8px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;border:1px solid var(--line2);border-radius:10px;background:var(--cream);font-family:var(--sans);font-size:16px;color:var(--ink);padding:13px 15px}
.comment-form input:focus,.comment-form textarea:focus{outline:0;border-color:var(--lav)}
.comment-form .form-submit input,.comment-form input[type=submit]{background:var(--lav);color:#fff;border:0;border-radius:12px;padding:15px 30px;font-family:var(--sans);font-size:15px;font-weight:500;cursor:pointer}
.comment-form .comment-form-cookies-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted)}
.comment-form .comment-form-cookies-consent label{font-weight:400;color:var(--muted);margin:0}
.comment-notes,.logged-in-as{font-size:14px;color:var(--muted)}
/* ---------- Components keep their own colours inside content areas ----------
   .entry a, .art a and .ftr a set a link colour. Buttons, badges and cards are
   links too, so they must be immune to it. */
.entry .btn,.art .btn,.lb .btn,.ftr .btn,.entry .btn:hover,.art .btn:hover{color:#fff}
.entry .btn-o,.art .btn-o,.lb .btn-o{color:var(--lav-d)}
.entry .store,.art .store,.lb .store,.entry .store .t b,.art .store .t b,
.entry .store .t small,.art .store .t small{color:#fff}
.entry .tag,.art .tag{color:var(--lav-d)}
.entry .featured h2,.art .featured h2{color:var(--ink)}
.ctaband .btn{color:#fff}
/* ---------- Contact FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-family:var(--serif);font-size:clamp(19px,2vw,23px);color:var(--ink);display:flex;justify-content:space-between;gap:20px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--lav);font-family:var(--sans);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"\2013"}
.faq p{margin:0 0 20px;font-size:16.5px;line-height:1.72;color:var(--body);max-width:70ch}
.faq a{color:var(--lav-d)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--lav-d);border:1px solid var(--line2);background:var(--white);border-radius:999px;padding:9px 20px}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--peach),var(--lav))}
.center{text-align:center}
/* ---------- Editorial polish: italic accent, principle cards ---------- */
.it{font-style:italic;color:var(--lav-d)}
h1 .it,h2 .it,h3 .it,.ser .it{font-style:italic}
.tips{display:grid;gap:20px}
.tip{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:clamp(26px,2.6vw,34px)}
.tip .n{font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--lav);display:block;margin-bottom:14px}
.tip h3{font-family:var(--serif);font-size:clamp(22px,2.2vw,26px);color:var(--ink);margin:0 0 12px;font-weight:400}
.tip p{margin:0;font-size:15.5px;line-height:1.68;color:var(--body)}
@media(max-width:900px){.tips{grid-template-columns:1fr 1fr!important}}
@media(max-width:620px){.tips{grid-template-columns:1fr!important}}
.orb{width:min(300px,60vw);aspect-ratio:1/1;border-radius:50%;margin:0 auto;
  background:radial-gradient(circle at 40% 34%,#FFFFFF 0%,#FFDCC2 22%,#F2C3DF 50%,#C6B0E7 84%);
  box-shadow:0 40px 80px -40px rgba(139,115,198,.7)}

/* ---------- Ported pages: terms, privacy, disclaimer, safety, join ---------
   These templates came across from the previous theme with their own class
   names. Styled here in the light palette so they match everything else. */
.page-hero{padding:clamp(56px,7vw,96px) var(--pad) clamp(30px,4vw,44px);max-width:900px;margin:0 auto;text-align:center}
.page-hero .eyebrow{margin-bottom:26px}
.page-hero .eyebrow .dot{display:none}
.page-title{font-family:var(--serif);font-size:clamp(40px,6vw,74px);line-height:1.04;color:var(--ink);font-weight:400;letter-spacing:-.015em;margin:0}
.page-title em{font-style:italic;color:var(--lav-d)}
.page-sub{font-size:clamp(17px,1.6vw,19px);color:var(--body);max-width:56ch;margin:26px auto 0;line-height:1.7}
.last-updated{font-size:13.5px;color:var(--muted);margin-top:22px}

.legal-toc{max-width:1220px;margin:0 auto;padding:0 var(--pad) clamp(30px,4vw,44px)}
.toc-card{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:clamp(24px,2.6vw,32px);max-width:560px;margin:0 auto}
.toc-label{font-size:11.5px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--lav);margin-bottom:16px}
.toc-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.toc-list a{display:flex;gap:14px;align-items:baseline;padding:9px 0;font-size:15.5px;color:var(--body);text-decoration:none;border-bottom:1px solid var(--line)}
.toc-list li:last-child a{border-bottom:0}
.toc-list a span{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--lav);min-width:24px}
.toc-list a:hover{color:var(--lav-d)}

.legal-content{max-width:820px;margin:0 auto;padding:clamp(20px,3vw,40px) var(--pad) clamp(60px,8vw,110px)}
.legal-content section{scroll-margin-top:120px;padding:clamp(28px,3.4vw,44px) 0;border-top:1px solid var(--line)}
.legal-content section:first-of-type{border-top:0}
.legal-content h2{font-family:var(--serif);font-size:clamp(26px,3vw,36px);color:var(--ink);font-weight:400;line-height:1.14;margin:0 0 18px;display:flex;gap:16px;align-items:baseline}
.legal-content h2 em{font-style:italic;color:var(--lav-d)}
.legal-content h2 .num{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--lav);flex:none}
.legal-content h3{font-family:var(--serif);font-size:22px;color:var(--ink);font-weight:400;margin:30px 0 10px}
.legal-content p,.legal-content li{font-size:16.5px;line-height:1.78;color:var(--body)}
.legal-content ul,.legal-content ol{padding-left:22px;margin:0 0 18px}
.legal-content li{margin-bottom:8px}
.legal-content a{color:var(--lav-d)}
.legal-content strong{color:var(--ink);font-weight:600}

.legal-notice{background:linear-gradient(160deg,#FFFFFF,#FBF8FF);border:1px solid #DFD5F0;border-radius:18px;padding:clamp(24px,3vw,32px);margin:0 0 40px;font-size:17px;line-height:1.72;color:var(--ink);
  box-shadow:0 0 0 5px rgba(139,115,198,.06),0 30px 60px -46px rgba(139,115,198,.6)}
.legal-notice strong{color:var(--lav-d)}

.legal-end{margin-top:56px;padding-top:34px;border-top:1px solid var(--line);text-align:center}
.legal-end-text{font-size:16px;color:var(--body);max-width:52ch;margin:0 auto 14px;line-height:1.7}
.legal-end-contact{font-size:16px}
.legal-end-contact a{color:var(--lav-d)}

/* Safety extras */
.emergency-card{background:#FDF0E8;border:1px solid #F3DCCE;border-left:3px solid var(--coral);border-radius:16px;padding:clamp(24px,3vw,34px);max-width:820px;margin:0 auto clamp(30px,4vw,44px)}
.emergency-label{font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#B4685F;margin-bottom:14px}
.emergency-card p{font-size:16.5px;line-height:1.74;color:var(--body);margin:0 0 10px}
.emergency-card strong{color:var(--ink)}
.emergency-card a{color:var(--lav-d)}

.red-flags{max-width:820px;margin:0 auto;padding:0 var(--pad)}
.red-flag-intro{font-size:16.5px;color:var(--body);max-width:58ch;margin-bottom:30px;line-height:1.72}
.red-flag-list{display:grid;grid-template-columns:1fr 1fr;gap:0 34px;list-style:none;margin:0;padding:0}
@media(max-width:720px){.red-flag-list{grid-template-columns:1fr}}
.red-flag{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.flag-dot{width:9px;height:9px;border-radius:3px;border:1.5px solid var(--coral);opacity:.75;flex:none;margin-top:7px}
.red-flag-text,.red-flag-title{font-size:15.5px;color:var(--body);line-height:1.6}

.report-section{max-width:820px;margin:clamp(40px,5vw,60px) auto 0;padding:0 var(--pad)}
.report-card{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:clamp(26px,3vw,38px)}
.report-card h2,.report-card h3{font-family:var(--serif);color:var(--ink);font-weight:400}
.report-card p{font-size:16px;color:var(--body);line-height:1.72}
.report-btn{display:inline-flex;align-items:center;gap:9px;background:var(--lav);color:#fff;padding:15px 30px;border-radius:12px;text-decoration:none;font-weight:500;font-size:15px;margin-top:12px}
.report-btn:hover{background:var(--lav-d);color:#fff}

.related-legal{max-width:1220px;margin:clamp(50px,6vw,80px) auto 0;padding:0 var(--pad) clamp(60px,8vw,100px)}
.related-legal-title{font-size:11.5px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--lav);margin-bottom:22px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:760px){.related-grid{grid-template-columns:1fr}}
.related-card{display:block;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:24px 26px;text-decoration:none;transition:border-color .25s ease,transform .25s ease}
.related-card:hover{border-color:var(--lav-l);transform:translateY(-2px)}
.related-card strong,.related-card h3{display:block;font-family:var(--serif);font-size:21px;color:var(--ink);font-weight:400;margin-bottom:6px}
.related-card span,.related-card p{font-size:14.5px;color:var(--muted);margin:0}

/* ---------- Ported safety page: section + tip classes ---------- */
.safety-section{max-width:1220px;margin:0 auto;padding:clamp(50px,6vw,86px) var(--pad)}
.safety-section.in-person{background:var(--cream2);max-width:none}
.safety-section.online{}
.safety-section.in-person > *{max-width:1220px;margin-left:auto;margin-right:auto}
.safety-emergency{max-width:1220px;margin:0 auto;padding:0 var(--pad)}
.section-title{font-family:var(--serif);font-size:clamp(30px,4vw,50px);color:var(--ink);font-weight:400;line-height:1.1;margin:0 0 16px}
.section-title em{font-style:italic;color:var(--lav-d)}
.section-intro{font-size:clamp(16px,1.6vw,18px);color:var(--body);max-width:58ch;margin:0 0 clamp(34px,4vw,50px);line-height:1.7}
.tip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:960px){.tip-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tip-grid{grid-template-columns:1fr}}
.tip-card{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:clamp(24px,2.6vw,32px)}
.tip-card h3{font-family:var(--serif);font-size:clamp(21px,2.1vw,25px);color:var(--ink);font-weight:400;margin:0 0 12px;line-height:1.2}
.tip-card h3 em{font-style:italic;color:var(--lav-d)}
.tip-card p{margin:0;font-size:15.5px;line-height:1.68;color:var(--body)}
.tip-num{display:block;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--lav);margin-bottom:12px}
.red-flags{padding-top:clamp(40px,5vw,70px);padding-bottom:clamp(20px,3vw,40px)}
.report-section{padding-bottom:clamp(50px,6vw,80px)}

/* ---------- Ported join page ---------- */
.join-page,.full-page{position:relative}
.join-ambient{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.join-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.join-orb-1{width:520px;height:520px;top:-160px;right:-120px;background:radial-gradient(circle,#FFD3B0,transparent 70%)}
.join-orb-2{width:460px;height:460px;top:220px;left:-140px;background:radial-gradient(circle,#E7CDF2,transparent 70%)}
.join-orb-3{width:600px;height:600px;bottom:-240px;left:40%;background:radial-gradient(circle,#D8C7F0,transparent 70%)}
.join-hero,.join-form-section{position:relative;z-index:1;max-width:1220px;margin:0 auto;padding:0 var(--pad)}
.join-hero{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(30px,4vw,48px);text-align:center}
.join-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--lav-d);border:1px solid var(--line2);background:var(--white);border-radius:999px;padding:9px 20px;margin-bottom:28px}
.join-title{font-family:var(--serif);font-size:clamp(40px,6vw,72px);line-height:1.05;color:var(--ink);font-weight:400;letter-spacing:-.015em;margin:0 auto;max-width:16ch}
.join-title em{font-style:italic;color:var(--lav-d)}
.join-sub{font-size:clamp(17px,1.6vw,19px);color:var(--body);max-width:54ch;margin:26px auto 0;line-height:1.7}
.join-launch-pill{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;color:var(--muted);border:1px solid var(--line);background:var(--white);border-radius:999px;padding:8px 18px;margin-top:24px}
.join-launch-dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--peach),var(--lav));display:inline-block;flex:none}
.join-perks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:clamp(36px,4vw,52px) auto 0;max-width:900px;text-align:left}
@media(max-width:800px){.join-perks{grid-template-columns:1fr}}
.join-perk{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:22px 24px;font-size:15px;color:var(--body);line-height:1.6;display:flex;gap:14px;align-items:flex-start}
.join-perk strong{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}
.join-perk-icon{width:34px;height:34px;border-radius:50%;background:var(--lav-s);display:grid;place-items:center;flex:none;color:var(--lav-d)}
.join-form-section{padding-bottom:clamp(60px,8vw,110px)}
.join-form-card{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:clamp(28px,3.4vw,46px);max-width:620px;margin:0 auto;box-shadow:0 40px 80px -60px rgba(139,115,198,.75)}
.join-form-header{text-align:center;margin-bottom:30px}
.join-form-title{font-family:var(--serif);font-size:clamp(26px,3vw,34px);color:var(--ink);font-weight:400;margin:0 0 10px}
.join-form-title em{font-style:italic;color:var(--lav-d)}
.join-form-sub{font-size:15.5px;color:var(--body);margin:0;line-height:1.65}
.join-field{margin-bottom:20px}
.join-field label{display:block;font-size:14.5px;font-weight:500;color:var(--ink);margin-bottom:8px}
.join-field input,.join-field select{width:100%;border:1px solid var(--line2);border-radius:10px;background:var(--cream);font-family:var(--sans);font-size:16px;color:var(--ink);padding:14px 16px;appearance:none}
.join-field input:focus,.join-field select:focus{outline:0;border-color:var(--lav)}
.join-select-wrap{position:relative}
.join-select-arrow{position:absolute;right:16px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted)}
.join-submit{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--lav);color:#fff;border:0;border-radius:12px;padding:16px 30px;font-family:var(--sans);font-size:16px;font-weight:500;cursor:pointer;transition:background .25s ease,transform .25s ease}
.join-submit:hover{background:var(--lav-d);transform:translateY(-1px)}
.join-submit:disabled{opacity:.6;cursor:default;transform:none}
.join-submit-text{color:#fff}
.join-submit-arrow{color:#fff}
.join-note{font-size:13.5px;color:var(--muted);text-align:center;margin:16px 0 0;line-height:1.6}
.join-success{text-align:center;padding:clamp(20px,3vw,30px) 0}
.join-success-orb{width:120px;height:120px;border-radius:50%;margin:0 auto 26px;background:radial-gradient(circle at 40% 34%,#FFFFFF,#FFDCC2 24%,#F2C3DF 52%,#C6B0E7 86%);box-shadow:0 30px 60px -34px rgba(139,115,198,.7)}
.join-success-check{color:var(--lav-d);font-size:26px;margin-bottom:14px}
.join-success-title{font-family:var(--serif);font-size:clamp(28px,3.2vw,38px);color:var(--ink);font-weight:400;margin:0 0 12px}
.join-success-title em{font-style:italic;color:var(--lav-d)}
.join-success-sub,.join-success-text{font-size:16px;color:var(--body);line-height:1.7;max-width:44ch;margin:0 auto 12px}
.join-success-confirm{font-size:14px;color:var(--muted)}
.join-success-brand{margin-top:30px}
.join-success-wordmark{font-family:var(--serif);font-size:24px;color:var(--ink)}

.join-perk span strong{display:block;color:var(--ink);font-weight:600;margin-bottom:3px}
.join-perk > span:last-child{font-size:14.5px;color:var(--body);line-height:1.55}
.join-perk-icon svg{stroke:var(--lav-d)}
.join-page{padding:0 0 clamp(50px,6vw,80px)}
.admin-bar .join-page{padding-top:0}

/* ---------------------------------------------------------------------------
   Mobile: every device is exactly the same size, everywhere.
   Pairs stack instead of overlapping, the hero shows one phone, and the
   four-step rows stop stretching to the full column width.
   --------------------------------------------------------------------------- */
@media(max-width:760px){
  .dev{--w:min(276px,72vw)}
  .seq .dev{--w:min(268px,70vw);margin-left:auto;margin-right:auto;margin-bottom:16px}
  .stack{flex-direction:column;align-items:center;gap:0}
  .stack .front{--w:min(300px,78vw);margin-right:0}
  .stack .back{display:block;--w:min(280px,72vw);margin-top:26px;align-self:center}
  .devpair{flex-direction:column;align-items:center;gap:30px}
  .devpair .a,.devpair .b{--w:min(300px,78vw);margin:0}
  .two{gap:28px}
}


/* ------------------------------------------------------------------
   Artwork blend.
   Three intersecting masks, nested so no mask-composite support is needed:
     .blend-y   vertical linear ramp
     .blend-r   off-centre ellipse, tuned per composition, which breaks the
                rectangular footprint so no photographic canvas is readable
     img        horizontal linear ramp
   Ellipse centres and radii come from measuring where the detail actually
   sits in each of these four images, so faces, hands and phones stay at
   full opacity and only the environment dissolves.
------------------------------------------------------------------ */
.artwork-blend{position:relative;margin:0;width:100%;max-width:var(--aw,440px);margin-inline:auto;
	--fx:11%;--fy:8%;
	--rx:80%;--ry:66%;--rcx:46%;--rcy:46%;--rcore:60%;
	--g1:rgba(190,163,230,.30);--g2:rgba(255,186,158,.24);--g3:rgba(255,214,196,.18)}

/* Atmosphere, far larger than the photograph so the colour bridges outward. */
.artwork-blend::before{content:"";position:absolute;inset:-38% -44%;z-index:0;pointer-events:none;
	background:
		radial-gradient(38% 30% at 36% 36%,var(--g1),transparent 70%),
		radial-gradient(34% 28% at 66% 62%,var(--g2),transparent 72%),
		radial-gradient(52% 44% at 50% 50%,var(--g3),transparent 76%);
	filter:blur(72px)}

.artwork-blend .blend-y{position:relative;z-index:1;display:block;
	-webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.20) calc(var(--fy) * .28),rgba(0,0,0,.66) calc(var(--fy) * .62),#000 var(--fy),#000 calc(100% - var(--fy)),rgba(0,0,0,.66) calc(100% - var(--fy) * .62),rgba(0,0,0,.20) calc(100% - var(--fy) * .28),transparent 100%);
	mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.20) calc(var(--fy) * .28),rgba(0,0,0,.66) calc(var(--fy) * .62),#000 var(--fy),#000 calc(100% - var(--fy)),rgba(0,0,0,.66) calc(100% - var(--fy) * .62),rgba(0,0,0,.20) calc(100% - var(--fy) * .28),transparent 100%);
	-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

.artwork-blend .blend-r{display:block;
	-webkit-mask-image:radial-gradient(var(--rx) var(--ry) at var(--rcx) var(--rcy),#000 var(--rcore),rgba(0,0,0,.72) calc(var(--rcore) + 14%),rgba(0,0,0,.28) calc(var(--rcore) + 27%),transparent 100%);
	mask-image:radial-gradient(var(--rx) var(--ry) at var(--rcx) var(--rcy),#000 var(--rcore),rgba(0,0,0,.72) calc(var(--rcore) + 14%),rgba(0,0,0,.28) calc(var(--rcore) + 27%),transparent 100%);
	-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

.artwork-blend img{display:block;width:100%;height:auto;aspect-ratio:1024/1536;
	-webkit-mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.20) calc(var(--fx) * .28),rgba(0,0,0,.66) calc(var(--fx) * .62),#000 var(--fx),#000 calc(100% - var(--fx)),rgba(0,0,0,.66) calc(100% - var(--fx) * .62),rgba(0,0,0,.20) calc(100% - var(--fx) * .28),transparent 100%);
	mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.20) calc(var(--fx) * .28),rgba(0,0,0,.66) calc(var(--fx) * .62),#000 var(--fx),#000 calc(100% - var(--fx)),rgba(0,0,0,.66) calc(100% - var(--fx) * .62),rgba(0,0,0,.20) calc(100% - var(--fx) * .28),transparent 100%);
	-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* Per composition. Detail centroid and 94% detail box measured from each asset. */
.artwork-blend--listen{--rcx:42%;--rcy:47%;--rx:84%;--ry:68%;--rcore:62%;--fx:10%;--fy:7%}
.artwork-blend--voice{--rcx:45%;--rcy:45%;--rx:78%;--ry:68%;--rcore:60%;--fx:12%;--fy:8%;--g1:rgba(190,163,230,.32)}
.artwork-blend--reveal{--rcx:46%;--rcy:44%;--rx:78%;--ry:66%;--rcore:60%;--fx:12%;--fy:9%;--g2:rgba(255,196,170,.22)}
.artwork-blend--connection{--rcx:51%;--rcy:46%;--rx:76%;--ry:72%;--rcore:58%;--fx:10%;--fy:7%;--g2:rgba(255,178,150,.26)}

/* Sizes. Desktop artwork bleeds a little past its grid column. */
.art-hero{--aw:min(560px,92vw)}
.art-hero .blend-y{animation:float 11s ease-in-out infinite}
.art-wide{--aw:min(620px,92vw)}
.art-col{--aw:min(470px,84vw)}
@media (min-width:1100px){
	.art-hero{--aw:600px;margin-right:-44px}
	.art-col{--aw:500px}
}
/* Mobile: less room, so pull the linear ramps in and widen the ellipse core
   slightly per image so no face approaches the falloff. */
@media (max-width:760px){
	.art-hero,.art-wide,.art-col{--aw:min(430px,90vw)}
	.artwork-blend--listen{--fx:8%;--fy:6%;--rcore:66%;--rx:88%}
	.artwork-blend--voice{--fx:9%;--fy:6%;--rcore:64%;--rx:82%}
	.artwork-blend--reveal{--fx:9%;--fy:7%;--rcore:64%;--rx:82%}
	.artwork-blend--connection{--fx:8%;--fy:6%;--rcore:63%;--rx:80%;--ry:76%}
}

/* About page artwork. Reuses .artwork-blend; these three already carry soft
   painted edges, so the ramps are gentler than the homepage set. Ellipse
   centres and cores come from measuring each composition. */
.artwork-blend--about-opening{--rcx:47%;--rcy:48%;--rx:80%;--ry:70%;--rcore:60%;--fx:9%;--fy:7%}
.artwork-blend--about-profiles{--rcx:49%;--rcy:49%;--rx:80%;--ry:72%;--rcore:60%;--fx:9%;--fy:7%;--g1:rgba(190,163,230,.34)}
.artwork-blend--about-connection{--rcx:47%;--rcy:48%;--rx:80%;--ry:72%;--rcore:60%;--fx:9%;--fy:7%;--g2:rgba(255,186,158,.28)}
.art-about{--aw:min(560px,88vw)}
@media (min-width:1100px){.art-about{--aw:600px}}
@media (max-width:760px){
	.art-about{--aw:min(430px,90vw)}
	.artwork-blend--about-opening,.artwork-blend--about-profiles,.artwork-blend--about-connection{--fx:7%;--fy:5%;--rcore:64%;--rx:86%}
}

/* Let Luna introduce: a featured capability beneath the two allowance cards.
   Same cream, lavender and blush language as the rest of the page, wider than
   the allowance pair and softly lit so it does not read as a third tier. */
.lunabox{position:relative;max-width:660px;margin:clamp(18px,2.2vw,26px) auto 0;padding:clamp(28px,3.2vw,40px);
	border:1px solid var(--line);border-radius:20px;background:var(--white);text-align:center;overflow:hidden}
.lunabox::before{content:"";position:absolute;inset:-40% -30% auto;height:170%;pointer-events:none;z-index:0;
	background:radial-gradient(42% 46% at 28% 24%,rgba(190,163,230,.22),transparent 70%),
		radial-gradient(40% 44% at 74% 70%,rgba(255,186,158,.18),transparent 72%);
	filter:blur(46px)}
.lunabox > *{position:relative;z-index:1}
.lunabox-n{font-size:clamp(26px,3vw,36px);margin:12px 0 4px}
@media(max-width:760px){.lunabox{padding:26px 22px}}
