/* ============================================================
   Grab Your Y Lab pages: warm paper look, brand colors, site fonts.
   Shared by lab.html (overview) and feelings-are-data.html.
   ============================================================ */
.paper{
  --paper:#F3ECDC;--paper-light:#FBF6EA;--paper-deep:#EBE1CB;--kraft:#D8C39B;
  --ink:#1F1B14;--ink-soft:#423C30;--ink-mute:#6D675A;
  --yellow:#F2C300;--rust:#C0603A;--green:#77C58C;--green-ink:#3F7D57;
  background:var(--paper);color:var(--ink);font-family:"Archivo",system-ui,sans-serif;line-height:1.6;
}
.lwrap{max-width:1080px;margin:0 auto;padding:0 clamp(1.1rem,4vw,2rem);}
.paper section{padding-block:clamp(2.6rem,6vw,4.4rem);}
.paper .eyebrow{font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.16em;font-size:0.74rem;color:var(--rust);margin:0 0 0.6rem;}
.paper h1{font-family:"Anton",Impact,sans-serif;text-transform:uppercase;line-height:0.9;letter-spacing:0.01em;color:var(--ink);font-size:clamp(2.8rem,7vw,4.6rem);margin:0 0 0.5rem;}
.paper h2{font-family:"Anton",Impact,sans-serif;text-transform:uppercase;line-height:0.92;color:var(--ink);font-size:clamp(2rem,5vw,3.2rem);margin:0 0 0.3rem;}
.paper .sub{font-family:"Archivo";font-weight:700;color:var(--rust);font-size:clamp(1.05rem,2.4vw,1.3rem);margin:0 0 0.3rem;}
.paper .meta-line{font-weight:600;text-transform:uppercase;letter-spacing:0.08em;font-size:0.76rem;color:var(--ink-mute);margin:0 0 1rem;}
.paper p{color:var(--ink-soft);}
.paper .lead{font-size:clamp(1.05rem,2vw,1.18rem);max-width:36rem;}

.lb-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:center;}
.lb-video{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid var(--paper-deep);box-shadow:0 16px 40px rgba(31,27,20,0.18);background:#000;}
.lb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.lb-video-cap{margin:0.7rem 0 0;font-size:0.82rem;color:var(--ink-mute);font-weight:500;}
.lb-video-cap b{color:var(--ink-soft);}

.lb-btn{display:inline-flex;align-items:center;gap:0.5rem;text-decoration:none;font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.08em;font-size:0.8rem;padding:0.9rem 1.4rem;border-radius:100px;border:2px solid var(--ink);transition:transform .18s ease,background .2s ease,color .2s ease,border-color .2s ease;}
.lb-btn .arrow{transition:transform .2s ease}
.lb-btn:hover .arrow{transform:translateX(4px)}
.lb-btn--solid{background:var(--yellow);border-color:var(--yellow);color:#231a06;}
.lb-btn--solid:hover{background:#ffd42a;border-color:#ffd42a;transform:translateY(-2px);}
.lb-btn--ghost{background:transparent;color:var(--ink);}
.lb-btn--ghost:hover{background:var(--ink);color:var(--paper-light);transform:translateY(-2px);}
.lb-btnrow{display:flex;flex-wrap:wrap;gap:0.7rem;margin-top:1.4rem;}

.paper .band-deep{background:var(--paper-deep);}

/* faint figure behind a section, low opacity, grayscale */
.band-figure{position:relative;overflow:hidden;}
.band-figure::before{content:"";position:absolute;inset:0;background:url("../assets/lab/bg-idea.jpg") center/cover no-repeat;opacity:0.12;filter:grayscale(1);}
.band-figure > *{position:relative;z-index:1;}

.method-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.method-label{font-weight:800;text-transform:uppercase;letter-spacing:0.14em;font-size:0.74rem;color:var(--rust);}
.lb-method{display:grid;grid-template-columns:repeat(2,1fr);gap:0 2rem;margin-top:1.4rem;}
.lb-step{display:grid;grid-template-columns:auto 1fr;gap:0.9rem;padding:1.05rem 0;border-top:1px solid var(--kraft);}
.lb-step .num{font-family:"Anton",Impact,sans-serif;font-size:2.3rem;line-height:1;color:var(--yellow);-webkit-text-stroke:1px rgba(31,27,20,0.35);}
.lb-step h3{margin:0 0 0.3rem;display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.04em;font-size:0.94rem;color:var(--ink);}
.lb-chip{font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.06em;font-size:0.62rem;background:var(--rust);color:#fff;padding:0.2rem 0.5rem;border-radius:100px;}
.lb-step p{margin:0;font-size:0.94rem;}

/* method as bigger yellow buttons; hover/tap flips dark and reveals a definition */
.method-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:0.7rem;margin-top:1.4rem;}
.mbtn{font-family:"Archivo",sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:0.08em;font-size:clamp(0.95rem,2vw,1.18rem);color:#231a06;background:var(--yellow);border:1.5px solid var(--yellow);border-radius:100px;padding:0.85rem 1.75rem;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .15s ease;}
.mbtn:hover,.mbtn.is-on{background:var(--ink);color:var(--paper-light);border-color:var(--ink);transform:translateY(-1px);}
.method-def{max-width:44rem;margin:1.2rem auto 0;min-height:1.6rem;color:var(--ink-soft);font-size:clamp(0.98rem,1.6vw,1.1rem);line-height:1.5;opacity:0;transition:opacity .2s ease;}
.method-def.show{opacity:1;}

.tool-callout{margin-top:2rem;padding:1.1rem 1.2rem;background:var(--paper-light);border-left:3px solid var(--green);border-radius:0 12px 12px 0;}
.tool-callout .k{font-weight:800;text-transform:uppercase;letter-spacing:0.12em;font-size:0.72rem;color:var(--green-ink);margin:0 0 0.35rem;}
.tool-callout p{margin:0;font-size:0.95rem;}
.tool-callout b{color:var(--ink);}

.lb-leaves{display:grid;grid-template-columns:repeat(2,1fr);gap:0.9rem 2rem;margin-top:1.5rem;}
.lb-leaf{display:grid;grid-template-columns:auto 1fr;gap:0.7rem;align-items:start;font-size:0.98rem;color:var(--ink-soft);}
.lb-leaf .dot{width:9px;height:9px;border-radius:50%;background:var(--yellow);margin-top:0.5rem;}
.lb-leaf b{color:var(--ink);}

.lb-tags{display:flex;flex-wrap:wrap;gap:0.55rem;margin-top:1.2rem;}
.lb-tag{border:1px solid var(--kraft);color:var(--ink-soft);background:var(--paper-light);border-radius:100px;padding:0.5rem 0.95rem;font-size:0.86rem;font-weight:500;}
.lb-tag--on{border-color:var(--green);color:var(--green-ink);font-weight:700;}

/* Lab cards (overview): torn-paper collage tucked behind a cream info panel */
.lab-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem;margin-top:2.4rem;}
.lab-card{position:relative;display:block;overflow:visible;padding-top:52px;}
a.lab-card{color:inherit;text-decoration:none;cursor:pointer;}

/* the torn clipping, sitting behind the cream panel; lower portion hidden */
.lab-card__collage{
  display:block;width:82%;height:auto;margin:0 auto;position:relative;z-index:1;
  transform:rotate(var(--rest,-1deg));transform-origin:center bottom;
  filter:drop-shadow(0 8px 8px rgba(30,23,15,0.12));
  transition:transform .35s cubic-bezier(0.22,1,0.36,1);
  pointer-events:none;
}
.lab-card:hover .lab-card__collage{
  transform:translate(var(--hx,3px),-44px) scale(1.02) rotate(var(--hr,0.5deg));
}
/* per-card variety so it feels hand-assembled */
.lab-card--fad{--rest:-1deg;--hr:0.5deg;--hx:3px;}
.lab-card--stem{--rest:0.75deg;--hr:-0.5deg;--hx:-3px;}
.lab-card--comeup{--rest:-0.5deg;--hr:0.75deg;--hx:2px;}
.lab-card--capacity{--rest:1deg;--hr:-0.25deg;--hx:-2px;}

/* the cream information panel, in front */
.lab-card__body{
  position:relative;z-index:2;margin-top:-34%;
  background:var(--paper-light);border:1px solid var(--paper-deep);border-radius:16px;
  padding:1.1rem 1.2rem 1.3rem;box-shadow:0 10px 26px rgba(31,27,20,0.10);
  display:flex;flex-direction:column;gap:0.4rem;
  transition:transform .3s cubic-bezier(0.22,1,0.36,1);
}
.lab-card:hover .lab-card__body{transform:translateY(-2px);}
.lab-card__status{align-self:flex-start;font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.06em;font-size:0.6rem;padding:0.25rem 0.6rem;border-radius:100px;margin-bottom:0.15rem;}
.lab-card__status.on{background:var(--yellow);color:#231a06;}
.lab-card__status.soon{background:rgba(31,27,20,0.72);color:var(--paper-light);}
.lab-card__body h3{margin:0;font-family:"Anton",Impact,sans-serif;text-transform:uppercase;font-size:1.5rem;line-height:0.98;color:var(--ink);}
.lab-card__pt{font-family:"Archivo";font-weight:700;text-transform:uppercase;letter-spacing:0.08em;font-size:0.64rem;color:var(--rust);}
.lab-card__body p{margin:0.2rem 0 0;font-size:0.94rem;color:var(--ink-soft);}
.lab-card__link{margin-top:0.7rem;align-self:flex-start;font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:0.06em;font-size:0.72rem;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--yellow);padding-bottom:2px;}
.lab-card:hover .lab-card__link{color:var(--rust);border-color:var(--rust);}

/* touch devices (no hover): rest with the collage more exposed */
@media (hover:none){
  .lab-card__collage{transform:translateY(-18px) rotate(var(--rest,-1deg));}
}
/* respect reduced motion: keep the layering, drop the animation */
@media (prefers-reduced-motion:reduce){
  .lab-card__collage,.lab-card__body{transition:none;}
  .lab-card:hover .lab-card__collage{transform:rotate(var(--rest,-1deg));}
  .lab-card:hover .lab-card__body{transform:none;}
}

/* collage band */
.lab-collage{width:100%;border-radius:14px;overflow:hidden;border:1px solid var(--paper-deep);box-shadow:0 12px 30px rgba(31,27,20,0.14);margin-top:1.6rem;}
.lab-collage img{width:100%;height:auto;display:block;filter:grayscale(1) contrast(1.03);}

.lb-faq{display:grid;gap:0;margin-top:1.4rem;}
.lb-qa{border-top:1px solid var(--kraft);padding:1.1rem 0;}
.lb-qa:last-child{border-bottom:1px solid var(--kraft);}
.lb-qa h3{margin:0 0 0.35rem;font-family:"Archivo";font-weight:700;font-size:1.02rem;color:var(--ink);}
.lb-qa p{margin:0;font-size:0.96rem;}

.lb-fac{display:grid;grid-template-columns:200px 1fr;gap:1.6rem;align-items:center;}
.lb-fac img{width:100%;height:100%;object-fit:cover;border-radius:14px;filter:grayscale(1) contrast(1.02);border:1px solid var(--paper-deep);}
.lb-fac h2{font-size:clamp(1.6rem,4vw,2.4rem);}

.lb-cta{background:#141019;color:var(--paper-light);border-radius:16px;padding:clamp(1.6rem,4vw,2.4rem);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;margin:clamp(1.5rem,4vw,2.5rem) 0 0;}
.lb-cta h2{color:var(--paper-light);font-size:clamp(1.6rem,4vw,2.6rem);margin:0;}
.lb-cta .cta-y{color:var(--yellow);}

@media (max-width:820px){
  .lb-hero-grid{grid-template-columns:1fr;}
  .lb-method{grid-template-columns:1fr;gap:0;}
  .lb-leaves{grid-template-columns:1fr;}
  .lab-cards{grid-template-columns:1fr;}
  .lb-fac{grid-template-columns:1fr;}
  .lb-fac img{max-width:220px;}
}
@media (prefers-reduced-motion: reduce){
  .lab-card{animation:none;}
  .lab-card,.lab-card__media img{transition:none;}
}