/* Daylight homepage — scoped to #daylight so it cannot reach the header, footer or any other page */

#daylight *,
#daylight *::before,
#daylight *::after{box-sizing:border-box}

:root{
  /* ── surfaces: three warm levels, not one ── */
  --bg:#fcfaf7; --surface:#ffffff; --raised:#fffdfb;
  --sand:#f7f2ea; --sand-2:#f1ebe1;
  /* ── sage: the calm primary ── */
  --sage:#5e8c77; --sage-deep:#3f6b58; --sage-darker:#2f5343;
  --sage-tint:#e6efe9; --sage-tint-2:#f0f6f2; --sage-line:#d7e6de;
  /* ── apricot: the warm accent ── */
  --peach:#e9a07b; --peach-deep:#b86f4a; --peach-tint:#fbeee5; --peach-line:#f3ddcc;
  /* ── one cool tint, for variety only ── */
  --sky:#7fa9c4; --sky-tint:#e7eff4;
  --gold:#c9a86a;
  /* ── soft ink ── */
  --ink:#2e3335; --body:#5b6264; --muted:#89908f;
  --line:#ece5db; --line-2:#f4efe7;
  /* ── layered depth: tight contact shadow + wide ambient + inner highlight ── */
  --sh-1:inset 0 1px 0 rgba(255,255,255,.9), 0 1px 2px rgba(92,74,58,.05), 0 4px 12px -5px rgba(92,74,58,.12);
  --sh-2:inset 0 1px 0 rgba(255,255,255,.9), 0 1px 3px rgba(92,74,58,.06), 0 12px 26px -10px rgba(92,74,58,.16);
  --sh-3:inset 0 1px 0 rgba(255,255,255,.9), 0 2px 5px rgba(92,74,58,.07), 0 26px 52px -18px rgba(92,74,58,.22);
  --sh-4:inset 0 1px 0 rgba(255,255,255,.95), 0 3px 8px rgba(92,74,58,.07), 0 44px 88px -28px rgba(92,74,58,.28);
  --wrap:1240px; --gut:clamp(20px,4.5vw,40px);
  --r-xs:10px; --r-sm:14px; --r:20px; --r-lg:28px; --r-xl:36px; --r-2xl:44px;
  --ease:cubic-bezier(.22,.9,.3,1);
  --spring:cubic-bezier(.34,1.38,.44,1);
  --nav-h:78px;
}



#daylight{margin:0;background:var(--bg);position:relative;color:var(--ink);
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.68;overflow-x:hidden;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;font-feature-settings:"ss01","cv05"}

/* a whisper of paper grain — tactility is most of what reads as premium */
#daylight::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.028;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>")}

#daylight a{color:inherit}

#daylight .wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);position:relative;z-index:2}

/* anchor targets must clear the sticky bar */
#daylight section[id],
#daylight div[id^="s-"]{scroll-margin-top:calc(var(--nav-h) + 18px)}

#daylight h1,
#daylight h2,
#daylight h3,
#daylight h4{margin:0;line-height:1.16;letter-spacing:-.035em;font-weight:700}

#daylight h1{letter-spacing:-.045em}

#daylight :focus-visible{outline:3px solid var(--sage);outline-offset:3px;border-radius:10px}

#daylight ::selection{background:var(--peach-tint);color:var(--ink)}

#daylight .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}




/* ── atoms ───────────────────────────────── */
#daylight .pill{display:inline-flex;align-items:center;gap:9px;padding:9px 18px;border-radius:999px;
  background:var(--sage-tint);color:var(--sage-deep);font-size:.79rem;font-weight:700;letter-spacing:.005em}

#daylight .pill i{width:7px;height:7px;border-radius:50%;background:var(--sage);font-style:normal;flex:none}

#daylight .pill.peach{background:var(--peach-tint);color:var(--peach-deep)}

#daylight .pill.peach i{background:var(--peach)}

#daylight .pill.live i{animation:pulse 2.6s ease-out infinite}

@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(233,160,123,.55)}70%{box-shadow:0 0 0 8px rgba(233,160,123,0)}100%{box-shadow:0 0 0 0 rgba(233,160,123,0)}}

@media (prefers-reduced-motion:reduce){
#daylight .pill.live i{animation:none}
}


#daylight .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;
  padding:16px 34px;border-radius:999px;text-decoration:none;font-weight:700;font-size:1rem;
  letter-spacing:-.012em;border:1.5px solid transparent;cursor:pointer;position:relative;
  transition:transform .34s var(--ease),background .3s var(--ease),border-color .3s var(--ease)}

#daylight .btn::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;
  transition:opacity .34s var(--ease);pointer-events:none}

#daylight .btn:hover{transform:translateY(-3px)}

#daylight .btn:active{transform:translateY(-1px) scale(.988);transition-duration:.08s}

#daylight .btn-sage{background:var(--sage-deep);color:#fff;box-shadow:0 1px 2px rgba(47,83,67,.2),0 12px 22px -12px rgba(47,83,67,.55)}

#daylight .btn-sage::after{box-shadow:0 2px 4px rgba(47,83,67,.2),0 22px 34px -14px rgba(47,83,67,.55)}

#daylight .btn-sage:hover{background:var(--sage-darker)}

#daylight .btn-sage:hover::after{opacity:1}

#daylight .btn-peach{background:var(--peach);color:#3d2517;box-shadow:0 1px 2px rgba(184,111,74,.2),0 12px 22px -12px rgba(184,111,74,.5)}

#daylight .btn-peach::after{box-shadow:0 2px 4px rgba(184,111,74,.2),0 22px 34px -14px rgba(184,111,74,.5)}

#daylight .btn-peach:hover::after{opacity:1}

#daylight .btn-soft{background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:var(--sh-1)}

#daylight .btn-soft::after{box-shadow:var(--sh-2)}

#daylight .btn-soft:hover{border-color:var(--sage-line)}

#daylight .btn-soft:hover::after{opacity:1}


/* reveal — only hidden once JS proves it can put it back */
html.js-anim #daylight .rv{opacity:0;transform:translateY(26px);
  transition:opacity .9s var(--ease),transform .9s var(--ease)}

html.js-anim #daylight .rv.in,
#daylight .rv.in{opacity:1!important;transform:none!important}

@media (prefers-reduced-motion:reduce){
html.js-anim #daylight .rv{opacity:1;transform:none;transition:none}
}


#daylight .blob{position:absolute;border-radius:50%;pointer-events:none;z-index:0}

html.js-anim #daylight .blob{animation:float 16s ease-in-out infinite alternate;will-change:transform}

@keyframes float{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(10px,-28px,0) scale(1.07)}}

@media (prefers-reduced-motion:reduce){
html.js-anim #daylight .blob{animation:none}
}


/* scroll progress */
#daylight #prog{position:fixed;top:0;left:0;height:2px;width:0;z-index:95;
  background:linear-gradient(90deg,var(--sage),var(--peach));transition:width .1s linear}


/* ── navigation ──────────────────────────── */






















/* ── hero ────────────────────────────────── */
#daylight .hero{position:relative;overflow:hidden;padding:clamp(30px,4.5vw,56px) 0 clamp(48px,6.5vw,78px);text-align:center}

#daylight .hero .b1{width:640px;height:640px;top:-230px;left:-190px;
  background:radial-gradient(circle,var(--sage-tint) 0%,rgba(230,239,233,0) 68%)}

#daylight .hero .b2{width:580px;height:580px;top:-150px;right:-170px;animation-delay:-7s;
  background:radial-gradient(circle,var(--peach-tint) 0%,rgba(251,238,229,0) 68%)}

#daylight .hero .b3{width:440px;height:440px;bottom:-210px;left:40%;animation-delay:-3.5s;
  background:radial-gradient(circle,var(--sky-tint) 0%,rgba(231,239,244,0) 70%)}

#daylight .hero h1{font-size:clamp(2.3rem,5.5vw,4rem);font-weight:800;margin:24px auto 22px;max-width:17ch}

#daylight .hero h1 em{font-style:normal;color:var(--sage-deep);
  background:linear-gradient(transparent 63%,var(--peach-tint) 63%,var(--peach-tint) 94%,transparent 94%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .08em;border-radius:6px}

#daylight .hero .lede{font-size:clamp(1.04rem,1.55vw,1.19rem);color:var(--body);max-width:57ch;margin:0 auto 32px}


/* live tool search */
#daylight .search{max-width:540px;margin:0 auto 26px;position:relative}

#daylight .search[hidden]{display:none}

#daylight .search-in{display:flex;align-items:center;gap:12px;background:var(--surface);border:1.5px solid var(--line);
  border-radius:999px;padding:7px 8px 7px 22px;box-shadow:var(--sh-2);
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}

#daylight .search-in:focus-within{border-color:var(--sage);box-shadow:var(--sh-2),0 0 0 4px var(--sage-tint)}

#daylight .search-in svg{width:20px;height:20px;stroke:var(--muted);stroke-width:2;fill:none;flex:none}

#daylight .search input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:.99rem;color:var(--ink);
  padding:12px 0;outline:none}

#daylight .search input::placeholder{color:var(--muted)}

#daylight .search .go{min-height:46px;padding:0 24px;border-radius:999px;background:var(--sage-deep);color:#fff;
  border:0;font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;flex:none;
  transition:background .3s var(--ease),transform .3s var(--ease)}

#daylight .search .go:hover{background:var(--sage-darker);transform:translateY(-1px)}

#daylight .search .hint{margin:12px 0 0;font-size:.83rem;color:var(--muted)}

#daylight .search .hint b{color:var(--sage-deep);font-weight:700}


#daylight .hero-acts{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:28px}

#daylight .assure{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

#daylight .assure span{display:inline-flex;align-items:center;gap:9px;font-size:.84rem;font-weight:600;color:var(--body);
  background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 18px;box-shadow:var(--sh-1)}

#daylight .assure svg{width:15px;height:15px;stroke:var(--sage);stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}


/* ── answer console ──────────────────────── */
#daylight .console{margin-top:clamp(32px,4.5vw,52px);background:var(--surface);border-radius:var(--r-2xl);
  box-shadow:var(--sh-4);overflow:hidden;text-align:left;border:1px solid var(--line-2)}

#daylight .console-top{padding:20px 26px;background:linear-gradient(180deg,var(--sage-tint-2),rgba(240,246,242,.4));
  border-bottom:1px solid var(--sage-line);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}

#daylight .console-top .t{font-size:.98rem;font-weight:800;letter-spacing:-.03em}

#daylight .console-top .t small{display:block;font-weight:500;font-size:.82rem;color:var(--body);letter-spacing:-.01em;margin-top:2px}

#daylight .qbar{display:flex;gap:10px;padding:20px 26px 6px;overflow-x:auto;scrollbar-width:thin}

#daylight .qbar::-webkit-scrollbar{height:5px}

#daylight .qbar::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}

#daylight .qbtn{flex:none;min-height:46px;padding:11px 21px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--bg);color:var(--body);font:inherit;font-size:.87rem;font-weight:700;cursor:pointer;white-space:nowrap;
  letter-spacing:-.012em;
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease)}

#daylight .qbtn:hover{border-color:var(--sage);color:var(--sage-deep);transform:translateY(-2px)}

#daylight .qbtn:active{transform:translateY(0) scale(.985);transition-duration:.08s}

#daylight .qbtn[aria-selected="true"]{background:var(--sage-deep);border-color:var(--sage-deep);color:#fff;
  box-shadow:0 1px 2px rgba(47,83,67,.2),0 10px 18px -10px rgba(47,83,67,.6)}

#daylight .answer{padding:22px 26px 28px;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);
  gap:clamp(18px,3vw,34px);align-items:start;min-height:270px}

#daylight .answer .qline{grid-column:1/-1;font-size:.9rem;color:var(--muted);display:flex;gap:11px;align-items:baseline}

#daylight .answer .qline b{color:var(--peach-deep);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;flex:none;font-weight:800}

#daylight .ans-main .headline{font-size:clamp(1.7rem,3.3vw,2.35rem);font-weight:800;letter-spacing:-.05em;
  line-height:1.08;margin-bottom:12px;color:var(--sage-deep)}

#daylight .ans-main .sub{font-size:.97rem;color:var(--body);margin:0 0 18px}

#daylight .srcbox{background:var(--peach-tint);border:1px solid var(--peach-line);border-radius:var(--r);
  padding:16px 18px;font-size:.86rem;color:#6d4c37;position:relative}

#daylight .srcbox b{display:block;font-size:.69rem;letter-spacing:.15em;text-transform:uppercase;color:var(--peach-deep);
  margin-bottom:7px;font-weight:800}

#daylight .copy{margin-top:12px;min-height:38px;padding:8px 16px;border-radius:999px;border:1px solid var(--peach-line);
  background:rgba(255,255,255,.75);color:var(--peach-deep);font:inherit;font-size:.78rem;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:7px;transition:background .3s var(--ease),transform .3s var(--ease)}

#daylight .copy:hover{background:#fff;transform:translateY(-1px)}

#daylight .copy svg{width:13px;height:13px;stroke:currentColor;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}

#daylight .copy[hidden]{display:none}

#daylight .ans-rows{background:var(--bg);border-radius:var(--r-lg);padding:8px 20px;border:1px solid var(--line-2)}

#daylight .ans-rows .r{display:flex;justify-content:space-between;gap:16px;padding:14px 0;font-size:.9rem;flex-wrap:wrap}

#daylight .ans-rows .r+.r{border-top:1px solid var(--line-2)}

#daylight .ans-rows dt{color:var(--body)}

#daylight .ans-rows dd{margin:0;font-weight:800;text-align:right;letter-spacing:-.025em}

#daylight .answer.swap{animation:sw .52s var(--ease)}

@keyframes sw{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
#daylight .answer.swap{animation:none}
}

#daylight .console-foot{padding:16px 26px;background:var(--sand);border-top:1px solid var(--line);
  font-size:.83rem;color:var(--body);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}

#daylight .console-foot a{color:var(--sage-deep);text-decoration:none;font-weight:800}

#daylight .stamp{display:inline-flex;align-items:center;gap:8px;font-weight:600}

#daylight .stamp svg{width:15px;height:15px;stroke:var(--sage);stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round}


/* ── counters ────────────────────────────── */
#daylight .counts{margin:clamp(44px,6vw,80px) var(--gut) 0;background:var(--surface);border:1px solid var(--line-2);
  border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:clamp(26px,3.6vw,44px) clamp(18px,3vw,36px);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,30px);position:relative;z-index:2}

#daylight .cnt{text-align:center;padding:0 clamp(6px,1.4vw,18px)}

#daylight .cnt+.cnt{border-left:1px solid var(--line-2)}

#daylight .cnt b{display:block;font-size:clamp(2.3rem,4.6vw,3.4rem);font-weight:800;line-height:1;
  letter-spacing:-.055em;color:var(--sage-deep);font-variant-numeric:tabular-nums}

#daylight .cnt span{display:block;font-size:.83rem;color:var(--body);margin-top:12px;line-height:1.5}


/* ── sections ────────────────────────────── */
#daylight section{padding:clamp(58px,7.5vw,104px) 0;position:relative}

#daylight .tinted{background:var(--sand);border-radius:var(--r-2xl);margin:0 var(--gut)}

#daylight .shead{text-align:center;max-width:64ch;margin:0 auto clamp(34px,4.5vw,54px)}

#daylight .shead h2{font-size:clamp(1.85rem,3.8vw,2.7rem);font-weight:800;margin:18px 0 14px;letter-spacing:-.045em}

#daylight .shead p{margin:0;color:var(--body);font-size:1.04rem}


/* soft card */
#daylight .soft-card{background:var(--raised);border-radius:var(--r-lg);padding:32px 28px;position:relative;
  box-shadow:var(--sh-1);border:1px solid var(--line-2);
  transition:transform .4s var(--ease),border-color .4s var(--ease)}

#daylight .soft-card::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sh-3);
  opacity:0;transition:opacity .4s var(--ease);pointer-events:none}

#daylight .soft-card:hover{transform:translateY(-6px);border-color:var(--line)}

#daylight .soft-card:hover::after{opacity:1}

#daylight .ic{width:58px;height:58px;border-radius:19px;display:grid;place-items:center;margin-bottom:20px;
  transition:transform .45s var(--spring)}

#daylight .soft-card:hover .ic{transform:scale(1.08) rotate(-4deg)}

#daylight .ic svg{width:27px;height:27px;stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round}

#daylight .ic.sage{background:var(--sage-tint);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
#daylight .ic.sage svg{stroke:var(--sage-deep)}

#daylight .ic.peach{background:var(--peach-tint);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
#daylight .ic.peach svg{stroke:var(--peach-deep)}

#daylight .ic.sky{background:var(--sky-tint);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
#daylight .ic.sky svg{stroke:#41688a}


/* pathways */
#daylight .paths{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

#daylight .paths h3{font-size:1.3rem;margin-bottom:12px}

#daylight .paths p{margin:0 0 20px;color:var(--body);font-size:.96rem}

#daylight .paths a{display:inline-flex;align-items:center;gap:9px;font-size:.92rem;font-weight:800;
  text-decoration:none;color:var(--sage-deep);letter-spacing:-.015em}

#daylight .paths a i{font-style:normal;transition:transform .34s var(--ease)}

#daylight .soft-card:hover a i{transform:translateX(6px)}


/* tools */
#daylight .filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:32px}

#daylight .fbtn{min-height:46px;padding:12px 23px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--surface);font:inherit;font-size:.88rem;font-weight:700;color:var(--body);cursor:pointer;
  letter-spacing:-.012em;box-shadow:var(--sh-1);
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease)}

#daylight .fbtn:hover{border-color:var(--sage);color:var(--sage-deep);transform:translateY(-2px)}

#daylight .fbtn:active{transform:translateY(0) scale(.985);transition-duration:.08s}

#daylight .fbtn[aria-pressed="true"]{background:var(--sage-deep);border-color:var(--sage-deep);color:#fff;
  box-shadow:0 1px 2px rgba(47,83,67,.2),0 10px 18px -10px rgba(47,83,67,.6)}

#daylight .fbtn .c{font-size:.76rem;opacity:.62;margin-left:7px;font-weight:600}

#daylight .tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}

#daylight .tool{background:var(--raised);border-radius:var(--r-lg);padding:28px 26px;display:flex;flex-direction:column;
  min-width:0;text-decoration:none;box-shadow:var(--sh-1);border:1px solid var(--line-2);position:relative;
  transition:transform .4s var(--ease),border-color .4s var(--ease)}

#daylight .tool::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sh-3);
  opacity:0;transition:opacity .4s var(--ease);pointer-events:none}

#daylight .tool:hover{transform:translateY(-6px);border-color:var(--line)}

#daylight .tool:hover::after{opacity:1}

#daylight .tool .cat{display:inline-flex;align-items:center;gap:9px;font-size:.73rem;font-weight:800;color:var(--body);
  margin-bottom:14px;letter-spacing:.02em}

#daylight .tool .cat::before{content:"";width:9px;height:9px;border-radius:50%;flex:none;box-shadow:0 0 0 3px rgba(0,0,0,.035)}

#daylight .tool[data-c="deadlines"] .cat::before{background:var(--peach)}

#daylight .tool[data-c="coding"] .cat::before{background:var(--sage)}

#daylight .tool[data-c="coverage"] .cat::before{background:var(--sky)}

#daylight .tool[data-c="practice"] .cat::before{background:var(--gold)}

#daylight .tool h3{font-size:1.15rem;margin-bottom:10px}

#daylight .tool p{margin:0;color:var(--body);font-size:.92rem;line-height:1.6}

#daylight .tool .fact{margin-top:auto;padding-top:20px;font-size:.82rem;color:var(--muted);font-weight:700;
  display:flex;justify-content:space-between;gap:10px;align-items:center}

#daylight .tool .fact i{font-style:normal;width:34px;height:34px;border-radius:50%;background:var(--sage-tint);
  color:var(--sage-deep);display:grid;place-items:center;flex:none;font-weight:800;
  transition:background .34s var(--ease),color .34s var(--ease),transform .34s var(--spring)}

#daylight .tool:hover .fact i{background:var(--sage-deep);color:#fff;transform:translateX(4px) scale(1.06)}

#daylight .tool.hide{display:none}

#daylight .tool mark{background:var(--peach-tint);color:inherit;border-radius:4px;padding:0 2px}

#daylight .tcount{text-align:center;font-size:.88rem;color:var(--muted);margin-top:28px}

#daylight .tcount b{color:var(--sage-deep);font-weight:700}

#daylight .noresult{text-align:center;padding:44px 20px;color:var(--body)}

#daylight .noresult[hidden]{display:none}

#daylight .noresult strong{display:block;font-size:1.1rem;color:var(--ink);margin-bottom:8px}


/* recently updated */
#daylight .fresh{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}

#daylight .fr{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);padding:22px 22px;
  box-shadow:var(--sh-1);text-decoration:none;display:block;position:relative;
  transition:transform .36s var(--ease)}

#daylight .fr:hover{transform:translateY(-4px)}

#daylight .fr .when{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;color:var(--sage-deep);margin-bottom:11px}

#daylight .fr .when::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sage)}

#daylight .fr h3{font-size:1rem;margin-bottom:6px}

#daylight .fr p{margin:0;font-size:.85rem;color:var(--body);line-height:1.55}


/* evidence */
#daylight .evi{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:clamp(24px,3.5vw,44px);align-items:start}

#daylight .srcs{list-style:none;margin:0;padding:0;display:grid;gap:12px}

#daylight .srcs li{background:var(--surface);border-radius:var(--r);padding:20px 22px;display:grid;
  grid-template-columns:42px 1fr;gap:16px;box-shadow:var(--sh-1);border:1px solid var(--line-2);
  transition:transform .34s var(--ease)}

#daylight .srcs li:hover{transform:translateX(5px)}

#daylight .srcs .n{width:36px;height:36px;border-radius:13px;background:var(--sage-tint);color:var(--sage-deep);
  display:grid;place-items:center;font-size:.82rem;font-weight:800;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}

#daylight .srcs b{display:block;font-size:1rem;font-weight:800;margin-bottom:4px;letter-spacing:-.03em}

#daylight .srcs span{font-size:.89rem;color:var(--body);line-height:1.58}

#daylight .vow{background:linear-gradient(165deg,var(--sage-tint-2),var(--sage-tint));border:1px solid var(--sage-line);
  border-radius:var(--r-lg);padding:32px 30px}

#daylight .vow h3{font-size:1.42rem;margin-bottom:20px;letter-spacing:-.04em}

#daylight .vow ul{list-style:none;margin:0;padding:0}

#daylight .vow li{display:flex;gap:13px;padding:11px 0;font-size:.94rem;color:#3f4a45;line-height:1.6}

#daylight .vow li svg{width:20px;height:20px;flex:none;margin-top:3px;stroke:var(--sage-deep);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}

#daylight .vow .lks{margin-top:20px;padding-top:18px;border-top:1px solid var(--sage-line);font-size:.89rem;color:#4b5651}

#daylight .vow .lks a{color:var(--sage-darker);font-weight:800}


/* steps */
#daylight .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;position:relative}

#daylight .steps::before{content:"";position:absolute;top:30px;left:16%;right:16%;height:2px;
  background-image:linear-gradient(90deg,var(--line) 50%,transparent 50%);background-size:12px 2px}

#daylight .stp{text-align:center;position:relative}

#daylight .stp .n{width:60px;height:60px;border-radius:21px;background:var(--surface);border:1.5px solid var(--line);
  display:grid;place-items:center;font-weight:800;font-size:1.12rem;color:var(--sage-deep);
  margin:0 auto 20px;position:relative;z-index:2;box-shadow:var(--sh-1)}

#daylight .stp h3{font-size:1.2rem;margin-bottom:10px}

#daylight .stp p{margin:0;color:var(--body);font-size:.95rem}


/* guides */
#daylight .gwrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(24px,3.5vw,44px)}

#daylight .glead{display:block;text-decoration:none;background:var(--raised);border-radius:var(--r-lg);
  padding:34px 32px;box-shadow:var(--sh-1);border:1px solid var(--line-2);position:relative;
  transition:transform .4s var(--ease)}

#daylight .glead::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sh-3);
  opacity:0;transition:opacity .4s var(--ease);pointer-events:none}

#daylight .glead:hover{transform:translateY(-6px)}

#daylight .glead:hover::after{opacity:1}

#daylight .glead h3{font-size:clamp(1.42rem,2.7vw,1.98rem);margin:16px 0 14px;letter-spacing:-.045em}

#daylight .glead p{margin:0 0 20px;color:var(--body)}

#daylight .glead .rd{display:inline-flex;align-items:center;gap:9px;font-size:.92rem;font-weight:800;color:var(--sage-deep)}

#daylight .glead .rd i{font-style:normal;transition:transform .34s var(--ease)}

#daylight .glead:hover .rd i{transform:translateX(6px)}

#daylight .grest{list-style:none;margin:0;padding:0;display:grid;gap:12px;align-content:start}

#daylight .grest a{display:block;text-decoration:none;background:var(--surface);border-radius:var(--r);
  padding:20px 22px;box-shadow:var(--sh-1);border:1px solid var(--line-2);
  transition:transform .34s var(--ease),border-color .34s var(--ease)}

#daylight .grest a:hover{transform:translateX(7px);border-color:var(--line)}

#daylight .grest .d{font-size:.71rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

#daylight .grest h4{font-size:1.05rem;margin:8px 0 5px;letter-spacing:-.035em}

#daylight .grest p{margin:0;font-size:.87rem;color:var(--body)}


/* FAQ */
#daylight .faq{max-width:860px;margin:0 auto;display:grid;gap:12px}

#daylight .faq details{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);
  box-shadow:var(--sh-1);overflow:hidden;transition:border-color .3s var(--ease)}

#daylight .faq details[open]{border-color:var(--sage-line)}

#daylight .faq summary{list-style:none;cursor:pointer;padding:22px 26px;display:flex;align-items:center;
  justify-content:space-between;gap:18px;font-weight:700;font-size:1.04rem;letter-spacing:-.03em;min-height:56px}

#daylight .faq summary::-webkit-details-marker{display:none}

#daylight .faq summary::after{content:"";width:12px;height:12px;flex:none;border-right:2.4px solid var(--sage-deep);
  border-bottom:2.4px solid var(--sage-deep);transform:rotate(45deg) translateY(-3px);
  transition:transform .34s var(--ease)}

#daylight .faq details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}

#daylight .faq summary:hover{color:var(--sage-deep)}

#daylight .faq .fa{padding:0 26px 24px;color:var(--body);font-size:.96rem}

#daylight .faq .fa p{margin:0 0 14px}

#daylight .faq .fa .cite{display:inline-flex;align-items:flex-start;gap:9px;font-size:.82rem;color:var(--peach-deep);
  background:var(--peach-tint);border:1px solid var(--peach-line);border-radius:var(--r-sm);padding:10px 14px;font-weight:600}


/* principles */
#daylight .tenets{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

#daylight .tenets h3{font-size:1.1rem;margin-bottom:9px}

#daylight .tenets p{margin:0;font-size:.92rem;color:var(--body)}


/* physicians */
#daylight .phys{background:linear-gradient(160deg,var(--peach-tint) 0%,#fdf4ec 55%,var(--sand) 100%);
  border:1px solid var(--peach-line);border-radius:var(--r-2xl);padding:clamp(32px,4.6vw,62px);
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,4vw,52px);align-items:center;
  position:relative;overflow:hidden}

#daylight .phys .b4{width:440px;height:440px;right:-150px;top:-130px;
  background:radial-gradient(circle,rgba(233,160,123,.3) 0%,rgba(233,160,123,0) 68%)}

#daylight .phys h2{font-size:clamp(1.72rem,3.3vw,2.42rem);margin:18px 0 16px;letter-spacing:-.045em}

#daylight .phys>div>p{color:#6d4c37;margin:0 0 28px;font-size:1.03rem}

#daylight .phys-card{background:var(--surface);border-radius:var(--r-lg);padding:30px 28px;box-shadow:var(--sh-3)}

#daylight .phys-card h3{font-size:.74rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}

#daylight .phys-card dl{margin:0}

#daylight .phys-card dt{font-weight:800;font-size:.98rem;display:flex;gap:11px;align-items:baseline;letter-spacing:-.028em}

#daylight .phys-card dt::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--peach);flex:none;
  box-shadow:0 0 0 3px var(--peach-tint)}

#daylight .phys-card dd{margin:5px 0 18px 19px;color:var(--body);font-size:.9rem}

#daylight .phys-card dd:last-of-type{margin-bottom:0}


/* final */
#daylight .final{background:linear-gradient(150deg,var(--sage-tint) 0%,var(--sage-tint-2) 46%,var(--peach-tint) 100%);
  border:1px solid var(--sage-line);
  border-radius:var(--r-2xl);margin:0 var(--gut) clamp(40px,6vw,72px);text-align:center;
  padding:clamp(54px,8vw,100px) clamp(24px,5vw,60px);position:relative;overflow:hidden}

#daylight .final h2{font-size:clamp(1.95rem,4.3vw,3.1rem);font-weight:800;letter-spacing:-.05em;margin-bottom:18px}

#daylight .final h2 em{font-style:normal;color:var(--sage-deep)}

#daylight .final p{color:#4e5a55;max-width:54ch;margin:0 auto 32px;font-size:1.06rem}

#daylight .final .acts{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

#daylight .final .fine{margin-top:26px;font-size:.85rem;color:#6b7772}


/* footer */


















/* ── responsive ──────────────────────────── */
@media (max-width:1080px){

  #daylight /* wrapping reads softer than a scrollbar once the pills stop fitting */
  .qbar{flex-wrap:wrap;overflow:visible}

  #daylight .qbtn{flex:0 1 auto}

  #daylight .answer{grid-template-columns:1fr}

  #daylight .evi,
#daylight .gwrap,
#daylight .phys{grid-template-columns:1fr}

  #daylight .tgrid,
#daylight .paths,
#daylight .fresh{grid-template-columns:repeat(2,minmax(0,1fr))}

  #daylight .tenets{grid-template-columns:repeat(2,1fr)}

  #daylight .paths .soft-card:nth-child(3){grid-column:span 2}

  #daylight .counts{grid-template-columns:repeat(2,1fr);gap:26px 0}

  #daylight .cnt:nth-child(3){border-left:0}

  #daylight .cnt:nth-child(3),
#daylight .cnt:nth-child(4){padding-top:26px;border-top:1px solid var(--line-2)}

}

@media (max-width:880px){

  
  
  
  
  
  
  #daylight .steps{grid-template-columns:1fr;gap:22px}

  #daylight .steps::before{display:none}

  #daylight .stp{display:grid;grid-template-columns:60px 1fr;gap:18px;text-align:left;align-items:start}

  #daylight .stp .n{margin:0}

}

@media (max-width:660px){

  #daylight{font-size:16px}

  #daylight .btn{width:100%}

  #daylight .tgrid,
#daylight .paths,
#daylight .tenets,
#daylight .fresh{grid-template-columns:1fr}

  #daylight .paths .soft-card:nth-child(3){grid-column:span 1}

  #daylight .counts{grid-template-columns:1fr;gap:0}

  #daylight .cnt{padding:22px 0;border-left:0!important}

  #daylight .cnt+.cnt{border-top:1px solid var(--line-2)}

  #daylight .cnt:nth-child(3),
#daylight .cnt:nth-child(4){padding-top:22px}

  
  #daylight .ans-rows .r{flex-direction:column;gap:3px}

  #daylight .ans-rows dd{text-align:left}

  #daylight .console-foot{flex-direction:column;gap:9px;align-items:flex-start}

  #daylight .tinted,
#daylight .final,
#daylight .counts{margin-left:12px;margin-right:12px}

  #daylight .soft-card,
#daylight .tool,
#daylight .glead{padding:24px 22px}

  #daylight .search .go{padding:0 18px}

  
  
  #daylight .faq summary{padding:18px 20px;font-size:.99rem}

  #daylight .faq .fa{padding:0 20px 20px}

}

@media (max-width:420px){
#daylight .answer{min-height:0}
}


/* ── wrappers that hold the preserved dynamic blocks (blog query, WPForms) ── */
#daylight .dl-guides,
#daylight .dl-contact{
  padding:clamp(58px,7.5vw,104px) 0;
  position:relative;
}
#daylight .dl-guides > .wrap,
#daylight .dl-contact > .wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}

/* the live blog query, restyled as Daylight cards (block structure untouched) */
#daylight .blog-area{
  max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);
}
#daylight .blog-area .post-main-area{
  background:var(--raised)!important;
  border:1px solid var(--line-2);
  border-radius:var(--r-lg)!important;
  box-shadow:var(--sh-1);
  padding:28px 26px!important;
  transition:transform .4s var(--ease),border-color .4s var(--ease);
}
#daylight .blog-area .post-main-area:hover{transform:translateY(-6px);border-color:var(--line);box-shadow:var(--sh-3)}
#daylight .blog-area .wp-block-post-title{
  font-size:1.18rem!important;line-height:1.24;letter-spacing:-.035em;font-weight:700;margin:0 0 10px;
}
#daylight .blog-area .wp-block-post-title a{color:var(--ink)!important;text-decoration:none}
#daylight .blog-area .wp-block-post-title a:hover{color:var(--sage-deep)!important}
#daylight .blog-area .wp-block-post-excerpt{margin:0 0 16px}
#daylight .blog-area .wp-block-post-excerpt__excerpt{
  color:var(--body)!important;font-size:.92rem!important;line-height:1.6;
}
#daylight .blog-area .wp-block-post-excerpt__more-link{color:var(--sage-deep)!important;font-weight:700}
#daylight .blog-area .date-box{
  display:inline-block;background:var(--sage-tint)!important;color:var(--sage-deep)!important;
  border-radius:999px!important;padding:7px 15px!important;
  font-size:.76rem!important;font-weight:700;letter-spacing:.02em;
}

/* the live WPForms block, restyled to match (form config untouched) */
#daylight .dl-contact .wpforms-container{
  max-width:760px;margin:0 auto!important;
}
#daylight .dl-contact .wpforms-form{
  background:var(--surface);border:1px solid var(--line-2)!important;
  border-radius:var(--r-lg)!important;box-shadow:var(--sh-2);
  padding:clamp(24px,3vw,38px)!important;
}
#daylight .dl-contact .wpforms-field-label{
  color:var(--ink)!important;font-weight:700!important;letter-spacing:-.02em;
}
#daylight .dl-contact input[type=text],
#daylight .dl-contact input[type=email],
#daylight .dl-contact input[type=tel],
#daylight .dl-contact input[type=url],
#daylight .dl-contact select,
#daylight .dl-contact textarea{
  border:1.5px solid var(--line)!important;background:var(--bg)!important;
  border-radius:var(--r-sm)!important;padding:14px 16px!important;
  font-family:inherit!important;font-size:.96rem!important;color:var(--ink)!important;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
#daylight .dl-contact input:focus,
#daylight .dl-contact select:focus,
#daylight .dl-contact textarea:focus{
  border-color:var(--sage)!important;box-shadow:0 0 0 4px var(--sage-tint)!important;outline:none!important;
}
#daylight .dl-contact .wpforms-submit{
  background:var(--sage-deep)!important;border:0!important;color:#fff!important;
  border-radius:999px!important;padding:16px 34px!important;min-height:56px;
  font-family:inherit!important;font-weight:700!important;font-size:1rem!important;
  box-shadow:0 1px 2px rgba(47,83,67,.2),0 12px 22px -12px rgba(47,83,67,.55);
  transition:background .3s var(--ease),transform .3s var(--ease);
}
#daylight .dl-contact .wpforms-submit:hover{background:var(--sage-darker)!important;transform:translateY(-3px)}

/* the closing CTA sits inside the wrapper now */
#daylight .final{margin-left:var(--gut);margin-right:var(--gut)}
@media (max-width:660px){
  #daylight .dl-guides,#daylight .dl-contact{padding-left:0;padding-right:0}
  #daylight .final{margin-left:12px;margin-right:12px}
}

/* ──────────────────────────────────────────────────────────────
   TYPOGRAPHY LOCK
   The theme applies font-family and colour DIRECTLY to heading
   elements. A directly-applied declaration always beats an
   inherited one, so headings must be set explicitly here or they
   fall back to the theme's Poppins and its near-black.
   ────────────────────────────────────────────────────────────── */
#daylight,
#daylight h1, #daylight h2, #daylight h3, #daylight h4, #daylight h5, #daylight h6,
#daylight p, #daylight a, #daylight span, #daylight li, #daylight dt, #daylight dd,
#daylight b, #daylight strong, #daylight em, #daylight i, #daylight small,
#daylight summary, #daylight details, #daylight label, #daylight div,
#daylight button, #daylight input, #daylight select, #daylight textarea{
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",Roboto,sans-serif !important;
}
#daylight h1, #daylight h2, #daylight h3, #daylight h4, #daylight h5, #daylight h6{
  color:var(--ink) !important;
  font-style:normal !important;
  text-transform:none !important;
}
/* intentionally coloured display type must survive the lock */
#daylight .hero h1 em,
#daylight .final h2 em{color:var(--sage-deep) !important}
#daylight .ans-main .headline{color:var(--sage-deep) !important}
#daylight .cnt b{color:var(--sage-deep) !important}
#daylight .srcs .n,
#daylight .pill{color:var(--sage-deep) !important}
#daylight .pill.peach{color:var(--peach-deep) !important}
#daylight .srcbox b,
#daylight .answer .qline b,
#daylight .fr .when{color:var(--sage-deep) !important}
#daylight .tool .cat{color:var(--body) !important}
#daylight .btn-sage,#daylight .btn-sage span{color:#fff !important}
#daylight .btn-peach{color:#3d2517 !important}
#daylight .qbtn[aria-selected="true"],
#daylight .fbtn[aria-pressed="true"]{color:#fff !important}
#daylight .tool .fact i{color:var(--sage-deep) !important}
#daylight .tool:hover .fact i{color:#fff !important}
/* the theme adds heading margins/sizes to .wp-block-heading — not used here, but guard anyway */
#daylight .wp-block-heading{margin-top:0;margin-bottom:0}

/* ══════════════════════════════════════════════════════════════
   OWNER FIXES — 2026-09-23 (mobile)
   5. articles stack one per row instead of two squeezed side by side
   6. section content centred rather than hugging the left
   7. more usable width — the tinted margin and wrap padding were
      stacking, leaving only 298px of 375px for content
   ══════════════════════════════════════════════════════════════ */

/* 5 ── one article per row. The theme's grid was resolving to
       two columns of 161px and 137px at 375px wide. */
@media (max-width:820px){
  #daylight .blog-area .wp-block-post-template{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  #daylight .blog-area .post-main-area{width:auto!important;padding:24px 22px!important}
  #daylight .blog-area .wp-block-post-title{font-size:1.16rem!important;line-height:1.3}
  #daylight .blog-area .wp-block-post-excerpt__excerpt{font-size:.94rem!important;line-height:1.62}
  #daylight .blog-area .date-box{font-size:.78rem!important}
}

@media (max-width:660px){
  /* 7 ── reclaim the width the double padding was eating */
  #daylight .wrap{padding-left:14px!important;padding-right:14px!important}
  #daylight .tinted,
  #daylight .dl-guides,
  #daylight .dl-contact,
  #daylight .final,
  #daylight .counts{margin-left:10px!important;margin-right:10px!important}
  #daylight .blog-area{padding-left:14px!important;padding-right:14px!important}

  /* 6 ── centre the content of every card and step */
  #daylight .soft-card,
  #daylight .tool,
  #daylight .fr,
  #daylight .stp,
  #daylight .tenets .soft-card,
  #daylight .paths .soft-card{text-align:center!important}
  #daylight .soft-card .ic,
  #daylight .stp .n{margin-left:auto!important;margin-right:auto!important}
  #daylight .tool .cat{justify-content:center}
  #daylight .tool .fact{justify-content:center;gap:12px}
  #daylight .paths a,
  #daylight .soft-card a{justify-content:center}

  /* steps go back to a centred stack rather than an icon list */
  #daylight .stp{display:block!important;text-align:center!important}
  #daylight .stp .n{margin-bottom:16px!important}

  /* sources, vow and physician panel read centred too */
  #daylight .srcs li{grid-template-columns:1fr!important;justify-items:center;text-align:center}
  #daylight .srcs .n{margin:0 auto 8px}
  #daylight .vow li{justify-content:center;text-align:center}
  #daylight .vow li svg{display:none}
  #daylight .vow,
  #daylight .vow .lks{text-align:center}
  #daylight .phys,
  #daylight .phys-card{text-align:center}
  #daylight .phys-card dt{justify-content:center}
  #daylight .phys-card dd{margin-left:0!important}
  #daylight .phys .btn{margin-left:auto;margin-right:auto}

  /* the answer console reads better centred at this width too */
  #daylight .answer .qline{justify-content:center;text-align:center}
  #daylight .ans-rows .r{align-items:center;text-align:center;flex-direction:column}
  #daylight .srcbox{text-align:center}
  #daylight .console-foot{align-items:center;text-align:center}
  #daylight .stamp{justify-content:center}
}
