/* Daydream — Lab Results / COA page (2026-10-22). Builds on dd.css (tokens, nav, footer, reveals). */
.dc{--acc:var(--pink)}

/* ---------------- HERO ---------------- */
.dc-hero{position:relative;isolation:isolate;overflow:clip;background:var(--night);color:#fff;
  min-height:min(100svh,980px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;
  gap:max(32px,calc(64*var(--u)));padding:calc(150px + 40*var(--u)) var(--gx) max(80px,calc(120*var(--u)))}
.dc-hero .dd-hero__bg{z-index:-1}
.dc-hero__copy{display:flex;flex-direction:column;gap:max(22px,calc(30*var(--u)));position:relative;z-index:2}
.dc-hero .dd-eyebrow{color:rgba(255,255,255,.6);animation:dd-fadeup 1s var(--ease) .1s both}
.dc-hero h1{font:900 max(48px,calc(128*var(--u)))/.92 var(--fd);letter-spacing:-.045em;margin:0;color:#fff}
.dc-hero h1 em{font-style:normal;color:transparent;background:linear-gradient(100deg,var(--cyan),var(--purple) 45%,var(--pink) 75%,var(--yellow));
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;animation:dc-sheen 9s ease-in-out infinite alternate}
.dc-hero h1 .dd-wi{animation:dd-rise 1.1s var(--ease) both;animation-delay:calc(.2s + var(--i)*.08s)}
.dc-hero__lede{font-size:max(16px,calc(19*var(--u)));line-height:1.6;color:rgba(255,255,255,.72);max-width:520px;margin:0;animation:dd-fadeup 1s var(--ease) .65s both}
.dc-stats{display:flex;flex-wrap:wrap;gap:max(14px,calc(20*var(--u)));margin:6px 0 0;padding:0;list-style:none}
.dc-stat{display:flex;flex-direction:column;gap:6px;padding:16px 22px;border-radius:18px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  animation:dd-fadeup .9s var(--ease) both;animation-delay:calc(.8s + var(--i)*.1s)}
.dc-stat b{font:900 max(26px,calc(34*var(--u)))/1 var(--fd);letter-spacing:-.03em}
.dc-stat span{font-size:13px;color:rgba(255,255,255,.6)}
.dc-hero__jump{display:flex;flex-wrap:wrap;gap:12px;animation:dd-fadeup 1s var(--ease) 1.1s both}

/* fanned pouches */
.dc-fan{position:relative;height:min(62vw,620px);z-index:1}
.dc-fan__p{position:absolute;left:50%;top:50%;width:46%;translate:calc(-50% + var(--tx)) calc(-50% + var(--ty));rotate:var(--r);
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.45));animation:dc-deal 1.25s var(--spring) both;animation-delay:calc(.35s + var(--i)*.11s)}
.dc-fan__p img{display:block;width:100%;height:auto;animation:dd-bob 5s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.9s)}
.dc-fan__p--c{width:56%;z-index:3}
.dc-fan__ring{position:absolute;inset:6%;border-radius:50%;border:1.5px dashed rgba(255,255,255,.18);animation:dd-spin 60s linear infinite}
.dc-fan__ring::after{content:"";position:absolute;inset:12%;border-radius:50%;border:1px solid rgba(255,255,255,.1)}
.dc-fan__seal{position:absolute;right:4%;top:6%;z-index:4;width:max(96px,calc(132*var(--u)));aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;text-align:center;background:var(--yellow);color:var(--ink);font:900 13px/1.1 var(--fd);letter-spacing:.02em;
  box-shadow:0 18px 40px rgba(0,0,0,.35);animation:dd-pop .9s var(--spring) 1.3s both}
.dc-fan__seal svg{position:absolute;inset:0;width:100%;height:100%;animation:dd-spin 18s linear infinite}
.dc-fan__seal text{font:700 9.5px var(--fd);letter-spacing:.18em;fill:var(--ink)}

/* ---------------- LISTS ---------------- */
.dc-sec{position:relative;padding:max(88px,calc(160*var(--u))) var(--gx) 0;display:flex;flex-direction:column;gap:max(40px,calc(64*var(--u)))}
.dc-sec:last-of-type{padding-bottom:max(88px,calc(160*var(--u)))}
.dc-sec__head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.dc-sec__title{display:flex;flex-direction:column;gap:24px}
.dc-sec__head .dd-lede{max-width:460px;margin:0}
.dc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:max(18px,calc(28*var(--u)))}
.dc-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}

.dc-card{position:relative;isolation:isolate;display:flex;flex-direction:column;border-radius:28px;overflow:clip;background:#fff;
  border:1px solid rgba(14,14,16,.1);box-shadow:0 1px 0 rgba(14,14,16,.04);
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .5s;transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.dc-card:hover{box-shadow:0 30px 70px -24px rgba(14,14,16,.35);border-color:transparent}
.dc-card.is-tilt{transition:transform .12s linear,box-shadow .7s var(--ease)}
.dc-card__media{position:relative;height:max(220px,calc(290*var(--u)));display:grid;place-items:center;overflow:clip;
  background:radial-gradient(120% 90% at 50% 100%,var(--a) 0%,var(--b) 70%,#14122b 100%)}
.dc-card__media::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.22),transparent 30%);
  animation:dd-spin 9s linear infinite;opacity:.55}
.dc-card__media::after{content:"";position:absolute;inset:0;background:url(/wp-content/uploads/dd/svg/ring.svg) center/78% no-repeat;opacity:.5;animation:dd-spin 40s linear infinite reverse}
.dc-card__media img{position:relative;z-index:1;width:68%;height:auto;rotate:var(--pr,-6deg);filter:drop-shadow(0 22px 26px rgba(0,0,0,.35));
  transition:transform .9s var(--spring)}
.dc-card:hover .dc-card__media img{transform:translateY(-10px) scale(1.06) rotate(4deg)}
.dc-card__media--doc{padding-top:44px}
.dc-card__media--doc img{width:40%;rotate:0deg;border-radius:6px;box-shadow:0 20px 40px rgba(0,0,0,.35);filter:none}
.dc-card__tag{position:absolute;z-index:2;left:18px;top:18px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);font:700 10.5px/1 var(--fd);letter-spacing:.12em}
.dc-card__pass{position:absolute;z-index:2;right:18px;top:18px;display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:rgba(10,10,18,.55);
  color:#fff;font:500 12px/1 var(--fb);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.dc-card__pass i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 0 rgba(201,236,74,.7);animation:dc-pulse 2.2s ease-out infinite}
.dc-card__body{display:flex;flex-direction:column;gap:18px;padding:max(22px,calc(30*var(--u)))}
.dc-card__batch{font:500 12px/normal var(--fd);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.dc-card h3{font:900 max(26px,calc(34*var(--u)))/1 var(--fd);letter-spacing:-.03em;margin:0;color:var(--ink)}
.dc-card__metric{display:flex;align-items:baseline;gap:12px;padding:18px 20px;border-radius:18px;background:linear-gradient(120deg,color-mix(in srgb,var(--a) 16%,#fff),#fff)}
.dc-card__metric b{font:900 max(36px,calc(48*var(--u)))/1 var(--fd);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.dc-card__metric span{font-size:14px;line-height:1.35;color:var(--body)}
.dc-rows{list-style:none;margin:0;padding:0;border-top:1px solid rgba(14,14,16,.1)}
.dc-rows li{position:relative;display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid rgba(14,14,16,.1);font-size:15px}
.dc-rows li span{color:var(--body)}
.dc-rows li b{font-weight:500;color:var(--ink);text-align:right}
.dc-rows li::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--a),transparent);transform:scaleX(0);transform-origin:left;opacity:0}
.dd-js .dc-card.is-in .dc-rows li::after{animation:dd-scan 1s var(--ease) both;animation-delay:calc(.5s + var(--i)*.13s)}
.dc-card__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:auto;padding-top:6px}
.dc-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 18px;border-radius:999px;font:700 14px/1 var(--fb);color:var(--ink);
  border:1.5px solid rgba(14,14,16,.18);transition:background .35s,color .35s,border-color .35s,transform .35s var(--spring)}
.dc-btn:hover{border-color:var(--ink);transform:translateY(-2px)}
.dc-btn--solid{background:var(--ink);border-color:var(--ink);color:#fff}
.dc-btn--solid:hover{background:var(--b);border-color:var(--b);color:#fff}
.dc-btn span{display:inline-block;transition:transform .4s var(--spring)}
.dc-btn:hover span{transform:translate(3px,-3px)}
.dc-link{margin-left:auto;font:700 14px/1 var(--fb);color:var(--ink);border-bottom:2px solid transparent;padding-bottom:3px;transition:border-color .3s}
.dc-link:hover{border-color:var(--a)}

/* card entrance (overrides the generic .dd-rv slide for a richer pop) */
.dd-js .dc-card.dd-rv{transform:translateY(70px) scale(.94) rotateX(10deg);transform-origin:50% 100%;filter:blur(6px);
  transition:opacity 1s var(--ease),transform 1.2s var(--ease),filter 1s var(--ease);transition-delay:calc(var(--i,0)*.12s)}
.dd-js .dc-card.dd-rv.is-in{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));filter:none}
.dd-js .dc-card.dd-rv.is-in.is-tilt{transition:transform .12s linear,box-shadow .7s var(--ease),opacity 1s var(--ease)}

/* ---------------- READ A COA (dark) ---------------- */
.dc-read{margin-top:max(88px,calc(160*var(--u)))}
.dc-read .dd-rule h3{font:700 max(22px,calc(28*var(--u)))/1.1 var(--fd);letter-spacing:-.02em;margin:0}
.dc-read .dd-rule p{color:var(--mist);line-height:1.6;margin:0}

@keyframes dc-deal{from{opacity:0;translate:-50% 30%;rotate:0deg;scale:.6}}
@keyframes dc-sheen{to{background-position:100% 0}}
@keyframes dc-pulse{0%{box-shadow:0 0 0 0 rgba(201,236,74,.7)}80%,100%{box-shadow:0 0 0 10px rgba(201,236,74,0)}}

@media (max-width:1100px){
  .dc-hero{grid-template-columns:1fr;min-height:0}
  .dc-fan{height:min(92vw,520px)}
  .dc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .dc-grid,.dc-grid--2{grid-template-columns:1fr}
  .dc-hero{padding-top:130px}
  .dc-fan__seal{right:0;top:0}
  .dc-fan{height:78vw;margin-top:-12px}
  .dc-link{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  .dc *{animation:none!important}
  .dd-js .dc-card.dd-rv{transform:none;filter:none}
}
