:root{
  --white:#ffffff;
  --offwhite:#f8f8fb;
  --ink:#131318;
  --ink-soft:#57576a;
  --ink-faint:#9797a8;
  --silver:#cfd3db;
  --holo-1:#c6b6ff;
  --holo-2:#a4ecdd;
  --holo-3:#ffc9e6;
  --holo-4:#b3e8ff;
  --holo-5:#ffe9a8;
  --chrome:#eef0f8;
  --line: rgba(19,19,24,0.09);
  --maxw: 1360px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:'Manrope',sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}
h1,h2,h3,.display{
  font-family:'Unbounded',sans-serif;
  margin:0;
  letter-spacing:-0.01em;
  line-height:1.02;
}
p{margin:0;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--holo-1); color:var(--ink);}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 6vw;}
.eyebrow{
  font-family:'Manrope',sans-serif;
  font-weight:700;
  font-size:11.5px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.eyebrow.holo{
  background:linear-gradient(90deg,#8e7cf0,#4fc7b6,#e77ab8,#8e7cf0);
  background-size:300% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:holoShift 8s linear infinite;
}
@keyframes holoShift{ to{background-position:300% 0;} }

/* ---------- focus visibility ---------- */
a:focus-visible, button:focus-visible{ outline:2px solid var(--ink); outline-offset:4px; border-radius:4px;}

/* ================= HOLOGRAPHIC DROPS ================= */
.holo-field{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1;}
.holo-drop{
  position:absolute;
  background:conic-gradient(from 120deg, #d8c9ff, #a4ecdd, #ffc9e6, #b3e8ff, #ffe9a8, #d8c9ff);
  filter: blur(0.3px) saturate(1.25);
  opacity:0.55;
  mix-blend-mode:normal;
  border-radius:42% 58% 63% 37% / 41% 44% 56% 59%;
  animation: blobMorph 16s ease-in-out infinite, holoHue 22s linear infinite, floaty 13s ease-in-out infinite;
  box-shadow: inset -18px -18px 40px rgba(255,255,255,0.55), inset 12px 14px 30px rgba(255,255,255,0.35), 0 30px 60px rgba(120,110,200,0.10);
  backdrop-filter: blur(2px);
}
.holo-drop::after{
  content:'';
  position:absolute; top:12%; left:16%; width:34%; height:22%;
  background:radial-gradient(closest-side, rgba(255,255,255,0.95), rgba(255,255,255,0));
  border-radius:50%;
  filter:blur(1px);
}
@keyframes blobMorph{
  0%,100%{ border-radius:42% 58% 63% 37% / 41% 44% 56% 59%; }
  33%{ border-radius:63% 37% 41% 59% / 55% 40% 60% 45%; }
  66%{ border-radius:37% 63% 55% 45% / 60% 55% 45% 40%; }
}
@keyframes holoHue{ to{ filter:blur(0.3px) saturate(1.25) hue-rotate(360deg);} }
@keyframes floaty{
  0%,100%{ transform:translate(0,0) rotate(0deg) scale(1); }
  50%{ transform:translate(0,-2.5%) rotate(6deg) scale(1.03); }
}

/* ================= NAV ================= */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 6vw;
  background:rgba(255,255,255,0);
  backdrop-filter:blur(0px);
  transition:background .5s ease, backdrop-filter .5s ease, padding .4s ease, box-shadow .4s ease;
}
.nav.scrolled{
  background:rgba(255,255,255,0.72);
  backdrop-filter:blur(16px) saturate(1.4);
  padding:14px 6vw;
  box-shadow:0 1px 0 var(--line);
}
.nav-logo{
  font-family:'Unbounded',sans-serif; font-weight:300; font-size:19px; letter-spacing:0.04em;
  display:flex; align-items:center; gap:11px;
}
.nav-logo img{ height:30px; width:auto; transition:transform .4s ease; }
.nav-logo:hover img{ transform:rotate(-4deg) scale(1.05); }
.etsy-note{
  display:flex; align-items:center; gap:8px; font-size:12px; color:var(--ink-faint); font-weight:600; margin-top:18px;
}
.etsy-note svg{flex-shrink:0;}
.footer-logo{display:flex; align-items:center; gap:12px;}
.footer-logo img{height:34px; width:auto;}
.credibility-row{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:22px;
}
.cred-pill{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 15px; border-radius:100px; border:1px solid var(--line);
  font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft);
  background:linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0));
}
.cred-pill .spark{
  width:6px; height:6px; border-radius:50%;
  background:conic-gradient(from 90deg,#8b6fef,#4fc7b6,#e77ab8,#8b6fef);
  animation:holoHue 6s linear infinite;
}
.nav-links{display:flex; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{
  font-size:13px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase;
  position:relative; padding-bottom:3px;
}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1.5px;
  background:linear-gradient(90deg,var(--holo-1),var(--holo-2),var(--holo-3));
  transition:width .35s ease;
}
.nav-links a:hover::after{width:100%;}
.nav-cta{
  font-size:12.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
  padding:11px 20px; border-radius:100px;
  background:var(--ink); color:#fff;
  transition:transform .3s ease, box-shadow .3s ease;
}
.nav-cta:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,0.18); }
.nav-mobile-toggle{display:none;}
@media (max-width:900px){
  .nav-links{display:none;}
  .nav-mobile-toggle{display:block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;}
}

/* ================= HERO ================= */
.hero{
  position:relative; min-height:100vh; display:flex; flex-direction:column;
  justify-content:center; align-items:center; text-align:center;
  padding:140px 6vw 150px;
  overflow:hidden;
}
.hero-tag{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 16px; border-radius:100px; border:1px solid var(--line);
  margin-bottom:34px; font-size:11px;
}
.hero-tag .dot{width:6px; height:6px; border-radius:50%; background:linear-gradient(135deg,var(--holo-1),var(--holo-3)); animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:.5; transform:scale(0.85);} 50%{opacity:1; transform:scale(1.15);}}

.hero h1{
  font-size:clamp(40px, 8vw, 108px);
  font-weight:700;
  position:relative;
  z-index:5;
}
.hero h1 .line2{
  background:linear-gradient(100deg,#8b6fef 0%, #4fc7b6 28%, #e77ab8 55%, #4fa8e0 78%, #8b6fef 100%);
  background-size:250% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:holoShift 9s linear infinite;
  display:block;
}
.hero-sub{
  max-width:520px; margin:30px auto 0; font-size:17px; line-height:1.6; color:var(--ink-soft); font-weight:500; z-index:5; position:relative;
}
.hero-ctas{ display:flex; gap:16px; margin-top:44px; flex-wrap:wrap; justify-content:center; z-index:5; position:relative;}
.btn{
  font-family:'Manrope',sans-serif; font-weight:700; font-size:13px; letter-spacing:0.05em; text-transform:uppercase;
  padding:17px 34px; border-radius:100px; cursor:pointer; border:none; display:inline-flex; align-items:center; gap:8px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, background .35s ease;
}
.btn-primary{
  background:var(--ink); color:#fff; position:relative; overflow:hidden;
}
.btn-primary::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(100deg,#8b6fef,#4fc7b6,#e77ab8,#4fa8e0);
  opacity:0; transition:opacity .4s ease;
}
.btn-primary span{position:relative; z-index:2;}
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(0,0,0,0.22); }
.btn-primary:hover::before{opacity:1;}
.btn-secondary{
  background:transparent; color:var(--ink); border:1.5px solid var(--ink);
}
.btn-secondary:hover{ background:var(--ink); color:#fff; transform:translateY(-3px); }

.hero-foot{
  margin-top:76px; margin-bottom:20px; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-faint); font-weight:700;
  z-index:5; position:relative;
}
.scroll-cue{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px; z-index:5;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); font-weight:700;
}
.scroll-cue .stick{width:1px; height:34px; background:linear-gradient(var(--ink-faint), transparent); position:relative; overflow:hidden;}
.scroll-cue .stick::after{content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--ink); animation:scrollDrip 2.2s ease-in-out infinite;}
@keyframes scrollDrip{ 0%{top:-100%;} 100%{top:100%;} }

/* ================= SECTION GENERIC ================= */
section{position:relative; z-index:2;}
.section-pad{padding:150px 6vw;}
@media (max-width:700px){ .section-pad{padding:96px 6vw;} }
.reveal{opacity:0; transform:translateY(36px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-delay-1{transition-delay:.08s;}
.reveal-delay-2{transition-delay:.16s;}
.reveal-delay-3{transition-delay:.24s;}

.section-head{max-width:760px; margin-bottom:64px;}
.section-head .eyebrow{margin-bottom:18px; display:block;}
.section-head h2{font-size:clamp(30px,4.6vw,58px); font-weight:600;}

/* ================= ABOUT ================= */
.about{background:var(--offwhite);}
.about-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:80px; align-items:center;}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr; gap:56px;} }
.portrait-wrap{position:relative; width:100%; max-width:380px; margin:0 auto;}
.portrait-frame{
  position:relative; aspect-ratio:4/5; border-radius:38% 62% 61% 39% / 44% 40% 60% 56%;
  background:linear-gradient(150deg,#efe8ff,#e2fbf5,#ffe6f3);
  padding:10px;
  animation:blobMorph 18s ease-in-out infinite;
}
.portrait-inner{
  width:100%; height:100%; border-radius:inherit;
  background:linear-gradient(160deg,#dcd3f7,#c9f1ea,#f7d3e6);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.6);
}
.portrait-inner .glyph{
  font-family:'Unbounded',sans-serif; font-weight:800; font-size:64px; color:rgba(19,19,24,0.28);
}
.portrait-inner img.brandmark{
  width:46%; height:auto; opacity:0.82; position:relative; z-index:2;
  filter:drop-shadow(0 8px 20px rgba(19,19,24,0.18));
}
.portrait-inner img.founder-photo{
  width:100%; height:100%; object-fit:cover; position:relative; z-index:1;
  filter:saturate(1.05);
}
.portrait-inner::after{
  content:''; position:absolute; top:-30%; left:-20%; width:70%; height:70%;
  background:radial-gradient(closest-side, rgba(255,255,255,0.85), rgba(255,255,255,0));
  animation:sheen 7s ease-in-out infinite;
}
@keyframes sheen{ 0%,100%{transform:translate(0,0);} 50%{transform:translate(60%,90%);} }
.portrait-caption{ text-align:center; margin-top:22px; font-size:13px; color:var(--ink-faint); font-weight:600;}

.about-copy p{ font-size:17px; line-height:1.75; color:var(--ink-soft); margin-bottom:20px;}
.about-copy p.lede{ font-size:22px; color:var(--ink); font-weight:500; line-height:1.5; margin-bottom:26px;}
.about-copy strong{color:var(--ink); font-weight:700;}

.stat-row{display:flex; gap:0; margin-top:52px; border-top:1px solid var(--line); flex-wrap:wrap;}
.stat{ flex:1; min-width:140px; padding:26px 20px 0; border-right:1px solid var(--line);}
.stat:last-child{border-right:none;}
.stat .num{font-family:'Unbounded',sans-serif; font-weight:700; font-size:clamp(24px,2.6vw,34px);
  background:linear-gradient(100deg,#8b6fef,#4fc7b6,#e77ab8); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat .lbl{font-size:12px; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-faint); font-weight:700; margin-top:6px;}

/* ================= SHOP ================= */
.shop-head-row{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap;}
.etsy-cta{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--ink); color:#fff; padding:18px 30px; border-radius:100px;
  font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  transition:transform .3s ease, box-shadow .3s ease; white-space:nowrap;
}
.etsy-cta:hover{transform:translateY(-3px) scale(1.02); box-shadow:0 16px 32px rgba(0,0,0,.2);}
.product-float-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:64px;
}
.specialize-block{
  margin-top:72px; padding-top:56px; border-top:1px solid var(--line);
  max-width:760px;
}
.specialize-head{
  font-family:'Unbounded',sans-serif; font-weight:600; font-size:clamp(26px,3.6vw,40px);
  margin:18px 0 22px; line-height:1.15;
}
.specialize-copy{ font-size:16.5px; line-height:1.75; color:var(--ink-soft); max-width:640px; }
.specialize-tags{ display:flex; gap:10px; flex-wrap:wrap; margin-top:28px; }
@media (max-width:900px){ .product-float-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .product-float-grid{grid-template-columns:1fr;} }
.product-card{
  display:block; position:relative; padding:30px 24px 26px; border-radius:26px;
  background:var(--offwhite); border:1px solid var(--line);
  transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease, background .5s ease;
  overflow:hidden;
}
.product-card:nth-child(2n){ transform:translateY(18px); }
.product-card:hover{ transform:translateY(-10px) rotate(-1deg); box-shadow:0 30px 50px rgba(80,60,150,0.16); background:#fff;}
.product-card:nth-child(2n):hover{ transform:translateY(6px) rotate(1deg); }
.product-blob{
  width:100%; aspect-ratio:1/0.9; border-radius:36% 64% 58% 42% / 46% 40% 60% 54%;
  margin-bottom:20px; position:relative; overflow:hidden;
  animation:blobMorph 14s ease-in-out infinite;
}
.product-card:nth-child(1) .product-blob{ background:conic-gradient(from 0deg,#c6b6ff,#a4ecdd,#c6b6ff);}
.product-card:nth-child(2) .product-blob{ background:conic-gradient(from 90deg,#ffc9e6,#b3e8ff,#ffc9e6); animation-delay:-3s;}
.product-card:nth-child(3) .product-blob{ background:conic-gradient(from 180deg,#ffe9a8,#c6b6ff,#ffe9a8); animation-delay:-6s;}
.product-card:nth-child(4) .product-blob{ background:conic-gradient(from 270deg,#a4ecdd,#ffc9e6,#a4ecdd); animation-delay:-9s;}
.product-blob::after{
  content:''; position:absolute; top:10%; left:14%; width:30%; height:20%;
  background:radial-gradient(closest-side, rgba(255,255,255,0.9), rgba(255,255,255,0)); border-radius:50%;
}
.product-cat{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); font-weight:700; margin-bottom:6px;}
.product-name{font-family:'Unbounded',sans-serif; font-size:17px; font-weight:600;}
.product-price{margin-top:10px; font-size:13px; color:var(--ink-soft); font-weight:600;}

/* ================= JOURNAL ================= */
.journal{background:var(--ink); color:#fff;}
.journal .eyebrow{color:rgba(255,255,255,0.5);}
.journal .eyebrow.holo{ -webkit-background-clip:text; background-clip:text;}
.journal .section-head h2{color:#fff;}
.journal-grid{display:flex; flex-direction:column; gap:1px; background:rgba(255,255,255,0.12); border-radius:24px; overflow:hidden; margin-top:56px; max-width:820px; margin-left:auto; margin-right:auto;}
.article-card{
  background:#18181f; padding:34px 26px; min-height:280px; display:flex; flex-direction:column; justify-content:space-between;
  transition:background .4s ease;
}
.article-card:hover{background:#1f1f29;}
.article-num{font-size:11px; color:rgba(255,255,255,0.35); font-weight:700; letter-spacing:.1em;}
.article-thumb{width:100%; max-width:300px; aspect-ratio:4/5; border-radius:16px; margin:0 auto 18px; object-fit:contain; background:rgba(255,255,255,0.04); display:block;}
.cover-blob{border-radius:36% 64% 58% 42% / 46% 40% 60% 54%; animation:blobMorph 14s ease-in-out infinite; position:relative; overflow:hidden;}
.cover-blob::after{content:''; position:absolute; top:10%; left:14%; width:30%; height:20%; background:radial-gradient(closest-side, rgba(255,255,255,.9), rgba(255,255,255,0)); border-radius:50%;}
.cover-blob.c-vinyl101{background:conic-gradient(from 0deg,#c6b6ff,#a4ecdd,#c6b6ff);}
.cover-blob.c-materials{background:conic-gradient(from 60deg,#ffe9a8,#c6b6ff,#ffe9a8);}
.cover-blob.c-care{background:conic-gradient(from 120deg,#b3e8ff,#ffc9e6,#b3e8ff);}
.cover-blob.c-style{background:conic-gradient(from 180deg,#ffc9e6,#b3e8ff,#ffc9e6); animation-delay:-4s;}
.cover-blob.c-reallife{background:conic-gradient(from 240deg,#a4ecdd,#ffc9e6,#a4ecdd); animation-delay:-8s;}
.cover-blob.c-myths{background:conic-gradient(from 300deg,#c6b6ff,#ffe9a8,#c6b6ff); animation-delay:-11s;}
.article-meta-row{display:flex; align-items:center; gap:10px; margin-bottom:6px;}
.article-cat{font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,0.5);}
.article-dot{width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,0.3);}
.article-time{font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,0.35);}
.article-title{font-family:'Unbounded',sans-serif; font-size:19px; font-weight:600; line-height:1.25; margin:20px 0 14px;}
.article-teaser{font-size:13.5px; color:rgba(255,255,255,0.55); line-height:1.6; flex-grow:1;}
.article-body{
  max-height:0; overflow:hidden; opacity:0;
  transition:max-height .5s cubic-bezier(.2,.7,.2,1), opacity .4s ease, margin-top .5s ease;
}
.article-body.open{ max-height:6000px; opacity:1; margin-top:16px; }
.article-body h2{font-family:'Unbounded',sans-serif; font-size:19px; font-weight:600; color:#fff; margin:30px 0 12px; line-height:1.3;}
.article-body h3{font-family:'Unbounded',sans-serif; font-size:15.5px; font-weight:600; color:#fff; margin:20px 0 10px;}
.article-body ul{margin:0 0 16px; padding-left:20px;}
.article-body li{margin-bottom:6px;}
.article-body .pull-quote{ font-family:'Unbounded',sans-serif; font-size:17px; font-weight:500; line-height:1.5; color:#fff; border-left:3px solid var(--holo-1); padding:4px 0 4px 18px; margin:24px 0;}
.article-body .product-callout{ display:flex; align-items:center; gap:14px; padding:16px 18px; border-radius:16px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); margin:22px 0; text-decoration:none; transition:transform .3s ease, background .3s ease;}
.article-body .product-callout:hover{ transform:translateY(-2px); background:rgba(255,255,255,0.09);}
.article-body .product-callout .pc-blob{width:56px; aspect-ratio:4/5; border-radius:10px; flex-shrink:0; object-fit:contain; background:rgba(255,255,255,0.06);}
.article-body .product-callout .pc-text{flex-grow:1;}
.article-body .product-callout .pc-label{font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,0.45); margin-bottom:4px;}
.article-body .product-callout .pc-title{font-family:'Unbounded',sans-serif; font-size:13.5px; font-weight:600; color:#fff;}
.article-body .product-callout .pc-arrow{font-size:17px; color:rgba(255,255,255,0.45); flex-shrink:0;}
.article-body .disclaimer-box{ background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius:14px; padding:16px 18px; font-size:12.5px; color:rgba(255,255,255,0.65); margin:20px 0;}
.article-body .disclaimer-box strong{color:#fff;}
.faq-block{margin-top:30px; padding-top:22px; border-top:1px solid rgba(255,255,255,0.12);}
.faq-block h4{font-family:'Manrope',sans-serif; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); margin-bottom:14px;}
.faq-item{border-bottom:1px solid rgba(255,255,255,0.1); padding:13px 0;}
.faq-q{display:flex; justify-content:space-between; align-items:center; gap:12px; cursor:pointer; background:none; border:none; width:100%; text-align:left; font-family:'Manrope',sans-serif; font-size:13.5px; font-weight:700; color:#fff; padding:0;}
.faq-q .arrow{transition:transform .3s ease; color:rgba(255,255,255,0.4); flex-shrink:0;}
.faq-q[aria-expanded="true"] .arrow{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; opacity:0; transition:max-height .5s ease, opacity .4s ease, margin-top .5s ease;}
.faq-a.open{max-height:300px; opacity:1; margin-top:9px;}
.faq-a p{font-size:13px; color:rgba(255,255,255,0.65); line-height:1.6; margin:0;}

/* festival edit article — hero + gallery */
.festival-hero{ position:relative; border-radius:20px; overflow:hidden; margin-bottom:26px;}
.festival-hero img{width:100%; aspect-ratio:4/5; object-fit:cover; display:block;}
.festival-hero .fh-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(10,8,16,0.92) 100%); display:flex; flex-direction:column; justify-content:flex-end; padding:24px;}
.festival-hero .fh-title{font-family:'Unbounded',sans-serif; font-weight:800; font-size:clamp(22px,5vw,32px); color:#fff; line-height:1.08; margin-bottom:10px;}
.festival-hero .fh-sub{font-size:13.5px; color:rgba(255,255,255,0.85); line-height:1.5; max-width:420px;}
.article-body .fx-gallery{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:22px 0;}
.article-body .fx-gallery img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; display:block;}
.article-body .fx-gallery.fx-wide{grid-template-columns:1fr;}
.article-body .fx-gallery.fx-wide img{aspect-ratio:16/9;}
.article-body .fx-single{width:100%; border-radius:16px; margin:22px 0; object-fit:cover; aspect-ratio:16/10; display:block;}
.uv-color-row{display:flex; gap:10px; flex-wrap:wrap; margin:18px 0 22px;}
.uv-chip{ padding:9px 16px; border-radius:100px; font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; border:1px solid rgba(255,255,255,0.18);}
.uv-chip.uv-white{background:rgba(255,255,255,0.9); color:#111;}
.uv-chip.uv-yellow{background:#e8ff5c; color:#111; border-color:transparent;}
.uv-chip.uv-orange{background:#ff8a3d; color:#111; border-color:transparent;}
.uv-chip.uv-pink{background:#ff5cc8; color:#111; border-color:transparent;}
.article-body p{ font-size:13.5px; color:rgba(255,255,255,0.7); line-height:1.65; margin-bottom:12px; }
.article-body p:last-child{ margin-bottom:0; }
.article-body strong{ color:#fff; }
.article-read{
  margin-top:22px; font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:6px; color:#fff;
  background:none; border:none; padding:0; cursor:pointer; font-family:'Manrope',sans-serif;
}
.article-read .arrow{ transition:transform .3s ease; }
.article-read[aria-expanded="true"] .arrow{ transform:rotate(90deg); }
.article-card:hover .article-read:not([aria-expanded="true"]) .arrow{ transform:translateX(6px); }
.article-read::before{
  content:''; width:7px; height:7px; border-radius:50%;
  background:linear-gradient(135deg,var(--holo-1),var(--holo-3));
}

/* ================= VINYL MASTER ================= */
.vm{ position:relative; background:linear-gradient(180deg,#fff, #f6f4ff); overflow:hidden;}
.vm-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:70px; align-items:center;}
@media (max-width:900px){ .vm-grid{grid-template-columns:1fr; gap:50px;} .vm-grid{direction:ltr;} }
.ebook-cover{
  perspective:1000px; margin:0 auto; max-width:320px; display:block;
}
.ebook-cover-inner{
  aspect-ratio:700/990; border-radius:14px; position:relative; overflow:hidden;
  box-shadow:0 40px 80px rgba(90,70,180,0.28), inset 0 0 0 1px rgba(255,255,255,0.4);
  transition:transform .15s ease;
  transform-style:preserve-3d;
}
.ebook-cover-inner img{ width:100%; height:100%; object-fit:cover; display:block; }
@keyframes holoBg{ 0%,100%{background-position:0% 50%;} 50%{background-position:100% 50%;} }
.ebook-cover-inner .ek{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,0.85); font-weight:700;}
.ebook-cover-inner h3{ font-family:'Unbounded',sans-serif; color:#fff; font-size:38px; font-weight:800; line-height:1.02; text-shadow:0 4px 24px rgba(0,0,0,0.15);}
.ebook-cover-inner .es{ font-size:12.5px; color:rgba(255,255,255,0.85); font-weight:600; line-height:1.5;}
.vm-copy .section-head{margin-bottom:26px;}
.vm-copy p{font-size:17px; line-height:1.75; color:var(--ink-soft); margin-bottom:24px;}
.vm-list{list-style:none; padding:0; margin:0 0 34px; display:flex; flex-direction:column; gap:13px;}
.vm-list li{ display:flex; gap:12px; align-items:flex-start; font-size:14.5px; color:var(--ink-soft); font-weight:500;}
.vm-list li::before{ content:'✦'; color:#8b6fef; flex-shrink:0; margin-top:1px;}

/* ================= CUSTOM ================= */
.custom{background:var(--offwhite);}
.custom-grid{display:block; max-width:720px; margin:0 auto; text-align:center;}
.custom-grid p{max-width:600px; margin-left:auto; margin-right:auto;}
.bag-stage{ position:relative; display:flex; align-items:center; justify-content:center; min-height:340px;}
.bag-shape{
  width:230px; height:270px; position:relative; transition:filter .6s ease;
}
.bag-body{
  position:absolute; inset:0; top:40px; border-radius:26px;
  background:linear-gradient(135deg,#c6b6ff,#a4ecdd);
  box-shadow:0 30px 60px rgba(90,70,180,0.22), inset 0 0 0 1px rgba(255,255,255,0.5);
  transition:background 0.6s ease;
}
.bag-flap{ position:absolute; top:20px; left:8%; width:84%; height:80px; border-radius:20px;
  background:linear-gradient(135deg, rgba(255,255,255,0.65), rgba(255,255,255,0.15));
  backdrop-filter:blur(2px);
}
.bag-strap{ position:absolute; top:-38px; left:50%; transform:translateX(-50%); width:150px; height:60px; border:10px solid var(--ink); border-bottom:none; border-radius:80px 80px 0 0; opacity:0.85;}
.swatch-row{display:flex; gap:14px; margin-top:36px; justify-content:center; flex-wrap:wrap;}
.swatch{
  width:38px; height:38px; border-radius:50%; cursor:pointer; border:2px solid #fff;
  box-shadow:0 0 0 1px var(--line), 0 6px 14px rgba(0,0,0,0.1);
  transition:transform .3s ease;
}
.swatch:hover, .swatch.active{ transform:scale(1.18); box-shadow:0 0 0 2px var(--ink), 0 8px 18px rgba(0,0,0,0.18);}
.custom-copy p{font-size:17px; line-height:1.75; color:var(--ink-soft); margin-bottom:30px;}

/* ================= FINAL CTA ================= */
.final{
  position:relative; text-align:center; padding:190px 6vw; overflow:hidden;
  background:var(--ink); color:#fff;
}
.final h2{
  font-size:clamp(34px,6.4vw,86px); font-weight:700; position:relative; z-index:5;
}
.final h2 .grad{
  background:linear-gradient(100deg,#a78bff,#5fe0cc,#ff9ecb,#7bc8ff,#a78bff);
  background-size:250% 100%; -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:holoShift 8s linear infinite;
}
.final-sub{margin:26px auto 46px; max-width:480px; font-size:16px; color:rgba(255,255,255,0.6); font-weight:500; position:relative; z-index:5;}
.final .btn-primary{ background:#fff; color:var(--ink); position:relative; z-index:5;}
.final .btn-primary::before{ opacity:0.14; }
.final .btn-primary:hover::before{opacity:0.9;}
.final .btn-primary:hover{color:#fff;}

/* ================= FOOTER ================= */
footer{ background:#fff; padding:70px 6vw 32px; border-top:1px solid var(--line);}
.footer-top{display:flex; justify-content:space-between; gap:50px; flex-wrap:wrap; padding-bottom:56px;}
.footer-logo{font-family:'Unbounded',sans-serif; font-weight:300; font-size:20px; letter-spacing:0.04em;}
.footer-tag{margin-top:14px; font-size:13px; color:var(--ink-faint); max-width:220px; line-height:1.6;}
.footer-cols{display:flex; gap:64px; flex-wrap:wrap;}
.footer-col h4{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); font-weight:700; margin-bottom:16px;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
.footer-col a{font-size:14px; font-weight:600; color:var(--ink); position:relative;}
.footer-col a:hover{ background:linear-gradient(90deg,#8b6fef,#4fc7b6); -webkit-background-clip:text; background-clip:text; color:transparent;}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid var(--line); flex-wrap:wrap; gap:16px;}
.footer-bottom p{font-size:12.5px; color:var(--ink-faint);}
.social-row{display:flex; gap:18px;}
.social-row a{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft);}
.social-row a:hover{color:var(--ink);}

/* cursor blob */
.cursor-holo{
  position:fixed; width:280px; height:280px; border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(circle, rgba(198,182,255,0.28), rgba(164,236,221,0.14) 45%, transparent 70%);
  transform:translate(-50%,-50%);
  transition:opacity .4s ease;
  filter:blur(10px);
  display:none;
}
@media (min-width:901px){ .cursor-holo{display:block;} }

/* contact modal */
.contact-overlay{
  position:fixed; inset:0; z-index:300; display:none;
  align-items:center; justify-content:center; padding:24px;
  background:rgba(15,13,20,0.6); backdrop-filter:blur(8px);
}
.contact-overlay.open{ display:flex; }
.contact-modal{
  position:relative; width:100%; max-width:460px; max-height:88vh; overflow-y:auto;
  background:#fff; border-radius:28px; padding:40px 34px 34px;
  box-shadow:0 40px 90px rgba(20,15,40,0.35);
  animation:modalIn .35s cubic-bezier(.2,.8,.2,1);
}
@keyframes modalIn{ from{ opacity:0; transform:translateY(18px) scale(.97);} to{ opacity:1; transform:translateY(0) scale(1);} }
.contact-modal .cm-close{
  position:absolute; top:18px; right:18px; width:34px; height:34px; border-radius:50%;
  background:var(--offwhite); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
  font-size:16px; color:var(--ink-soft); transition:background .25s ease, color .25s ease;
}
.contact-modal .cm-close:hover{ background:var(--ink); color:#fff; }
.contact-modal .eyebrow{display:block; margin-bottom:12px;}
.contact-modal h3{ font-size:clamp(24px,4vw,30px); font-weight:600; margin-bottom:8px; padding-right:30px;}
.contact-modal .cm-sub{ font-size:14.5px; color:var(--ink-soft); margin-bottom:26px; line-height:1.55;}
.cm-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px;}
@media (max-width:420px){ .cm-row{grid-template-columns:1fr;} }
.cm-field{margin-bottom:14px; display:flex; flex-direction:column; gap:6px;}
.cm-field label{font-size:11.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-soft);}
.cm-field input, .cm-field textarea{
  font-family:'Manrope',sans-serif; font-size:14.5px; color:var(--ink);
  padding:13px 16px; border-radius:14px; border:1px solid var(--line); background:var(--offwhite);
  outline:none; transition:box-shadow .25s ease, background .25s ease, border-color .25s ease;
  resize:vertical;
}
.cm-field input:focus, .cm-field textarea:focus{ background:#fff; border-color:var(--holo-1); box-shadow:0 6px 20px rgba(140,120,220,0.14); }
.cm-field input.cm-invalid, .cm-field textarea.cm-invalid{ border-color:#e2668a; background:#fff6f8; }
.cm-error{ font-size:12px; color:#c1436a; min-height:14px; }
.contact-modal .btn-primary{ width:100%; justify-content:center; margin-top:10px; }
.cm-success-view{ display:none; text-align:center; padding:10px 0 6px; }
.cm-success-view.cm-show{ display:block; }
.cm-success-view .cm-check{
  width:56px; height:56px; border-radius:50%; margin:0 auto 18px;
  background:linear-gradient(135deg,var(--holo-1),var(--holo-2));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:24px;
}
.cm-success-view h3{margin-bottom:10px;}
.cm-success-view p{font-size:14.5px; color:var(--ink-soft); line-height:1.6;}


/* ============ standalone blog page additions ============ */
.hidden{display:none !important;}
.wrap-article{max-width:760px; margin:0 auto; padding:0 6vw;}

/* blog index hero */
.blog-hero{position:relative; padding:150px 6vw 70px; text-align:center; overflow:hidden;}
.blog-hero h1{font-size:clamp(34px,6vw,70px); font-weight:700; position:relative; z-index:5;}
.blog-hero p.sub{max-width:600px; margin:22px auto 0; font-size:17px; color:var(--ink-soft); position:relative; z-index:5;}
.blog-controls{ max-width:900px; margin:44px auto 0; position:relative; z-index:5; display:flex; flex-direction:column; gap:22px; align-items:center;}
.search-box{ width:100%; max-width:460px; position:relative;}
.search-box input{ width:100%; padding:15px 20px 15px 46px; border-radius:100px; border:1px solid var(--line); background:var(--offwhite); font-family:'Manrope',sans-serif; font-size:14.5px; color:var(--ink); outline:none; transition:box-shadow .3s ease, background .3s ease;}
.search-box input:focus{background:#fff; box-shadow:0 8px 24px rgba(90,70,180,.12);}
.search-box svg{position:absolute; left:18px; top:50%; transform:translateY(-50%); color:var(--ink-faint);}
.cat-row{display:flex; gap:10px; flex-wrap:wrap; justify-content:center;}
.cat-btn{ padding:9px 18px; border-radius:100px; border:1px solid var(--line); background:#fff; font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); cursor:pointer; transition:all .3s ease;}
.cat-btn:hover{border-color:var(--ink);}
.cat-btn.active{background:var(--ink); color:#fff; border-color:var(--ink);}

/* real-photo cover images (replacing old gradient blobs) */
.cover-photo{ width:100%; aspect-ratio:4/5; max-width:300px; margin:18px auto 0; object-fit:contain; border-radius:16px; background:rgba(19,19,24,0.03); display:block;}
.cover-photo-large{ width:100%; max-width:400px; margin:40px auto 0; object-fit:contain; border-radius:20px; background:var(--offwhite); display:block; aspect-ratio:4/5;}
.cover-photo-featured{ width:100%; height:100%; object-fit:cover; display:block;}

/* featured article card */
.featured-card{
  display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:28px; overflow:hidden;
  border:1px solid var(--line); margin-top:64px; background:var(--offwhite);
  transition:box-shadow .4s ease;
}
.featured-card:hover{box-shadow:0 30px 60px rgba(90,70,180,.14);}
@media (max-width:800px){ .featured-card{grid-template-columns:1fr;} }
.featured-cover{ position:relative; min-height:320px; overflow:hidden; }
.featured-body{ padding:48px 44px; display:flex; flex-direction:column; justify-content:center;}
.featured-body .eyebrow{margin-bottom:14px; display:block;}
.featured-body h2{font-size:clamp(24px,3vw,34px); font-weight:600; margin-bottom:16px;}
.featured-body p{font-size:15.5px; color:var(--ink-soft);}

/* article grid on index page */
.article-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:56px;}
@media (max-width:980px){ .article-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:620px){ .article-grid{grid-template-columns:1fr;} }
.blog-card{ border-radius:24px; overflow:hidden; border:1px solid var(--line); background:var(--offwhite); transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease; display:flex; flex-direction:column;}
.blog-card:hover{ transform:translateY(-8px); box-shadow:0 26px 46px rgba(90,70,180,.14);}
.blog-card-body{padding:22px 22px 26px; display:flex; flex-direction:column; flex-grow:1;}
.blog-card .meta-tag{font-size:10px;}
.blog-card h3{font-size:18px; font-weight:600; margin:12px 0 10px; line-height:1.3; color:var(--ink);}
.blog-card p{font-size:14px; flex-grow:1; margin-bottom:16px; color:var(--ink-soft);}
.blog-card .read-link{font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; display:inline-flex; align-items:center; gap:6px; color:var(--ink);}
.blog-card .read-link .arrow{transition:transform .3s ease;}
.blog-card:hover .read-link .arrow{transform:translateX(6px);}
.related-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px;}
@media (max-width:800px){ .related-grid{grid-template-columns:1fr;} }
.related-section{background:var(--offwhite); padding:80px 6vw;}

/* article page header + body */
.breadcrumb{font-size:12px; color:var(--ink-faint); margin-bottom:18px; padding:0 6vw;}
.breadcrumb a{font-weight:600; color:var(--ink-soft);}
.breadcrumb a:hover{color:var(--ink);}
.article-hero{padding:140px 6vw 20px; text-align:center;}
.article-hero .wrap-article{ text-align:left; }
.article-hero .eyebrow{margin-bottom:16px; display:block;}
.article-hero h1{font-size:clamp(28px,5vw,48px); font-weight:700; margin-bottom:20px;}
.article-cover{ margin:0 auto; max-width:900px; padding:0 6vw;}
.article-body-content{ background:var(--ink); padding:56px 0 60px; margin-top:40px;}
.article-body-content .wrap-article{ color:rgba(255,255,255,0.75); }
.article-body-content p{ color:rgba(255,255,255,0.75); }
.article-body-content ul, .article-body-content ol{ color:rgba(255,255,255,0.75); }
.faq-section{padding:70px 6vw;}
.faq-list{max-width:760px; margin:0 auto;}