/* ---------- Paella Workshop "planet" detail page ---------- */
.planet-page{
  width:100vw; position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
  padding-block:0 !important;
  background:#4A160F;
  color:#F5EAE0;
  overflow:hidden;
}

.planet-bg{
  position:absolute; inset:0; z-index:0;
  display:flex; flex-direction:column;
  gap:18px;
  padding-block:4px;
  pointer-events:none;
  user-select:none;
  overflow:hidden;
}
.planet-bg-row{
  white-space:nowrap;
  font-family:'Fraunces',serif; font-weight:900; text-transform:uppercase;
  font-size:clamp(2.4rem, 7vw, 5rem);
  letter-spacing:0.01em;
  line-height:1;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(245,234,224,0.16);
}
.planet-bg-row.solid{
  -webkit-text-stroke:0;
  color:rgba(245,234,224,0.09);
}

.planet-top{
  position:relative; z-index:2;
  max-width:1160px; margin-inline:auto; padding-inline:20px;
  padding-top:28px;
}
.planet-top .detail-back{ color:rgba(245,234,224,0.85); }
.planet-top .detail-back:hover{ color:#F5EAE0; }

.planet-stage{
  position:relative; z-index:2;
  max-width:960px; margin-inline:auto;
  height:clamp(660px, 78vw, 900px);
}

.planet-photo{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:min(320px, 44vw); aspect-ratio:1/1; border-radius:50%;
  overflow:hidden;
  border:6px solid rgba(245,234,224,0.9);
  box-shadow:0 20px 60px rgba(0,0,0,0.45);
  z-index:3;
}
.planet-photo img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(1.08) contrast(1.04);
}

.planet-float{
  position:absolute; z-index:4;
  margin:0; max-width:260px;
  text-align:center;
}
.planet-float.type-title{
  font-family:'Fraunces',serif; font-weight:700; text-transform:uppercase;
  font-size:clamp(1.6rem, 3.4vw, 2.4rem); line-height:1.08;
  color:#F5EAE0; max-width:340px;
}
.planet-float.type-fact{
  font-family:'Fraunces',serif; font-style:italic; font-weight:500;
  font-size:1.08rem; line-height:1.4; color:rgba(245,234,224,0.8);
  max-width:210px;
}
.planet-float.type-tag{
  display:inline-block; font-family:'Karla',sans-serif; font-weight:700;
  font-size:0.92rem; letter-spacing:0.06em; text-transform:uppercase;
  color:#4A160F; background:#F5EAE0;
  padding:11px 20px; border-radius:999px; max-width:none; white-space:nowrap;
}

.planet-float--title{ top:0; left:50%; transform:translate(-50%,0) rotate(-2deg); }
.planet-float--tag1{ top:9%; right:0; transform:rotate(4deg); }
.planet-float--tag2{ top:47%; right:-4%; transform:translateY(-50%) rotate(-3deg); }
.planet-float--tag3{ top:47%; left:-4%; transform:translateY(-50%) rotate(3deg); }
.planet-float--fact1{ top:9%; left:0; transform:rotate(-4deg); }
.planet-float--fact2{ bottom:14%; right:2%; transform:rotate(3deg); }
.planet-float--fact3{ bottom:14%; left:2%; transform:rotate(-3deg); }

.planet-cta{
  position:absolute; z-index:4;
  top:calc(50% + min(160px, 22vw) + 22px);
  left:50%;
  transform:translateX(-50%);
  text-align:center;
}
.planet-btn{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  font-family:'Karla',sans-serif; font-weight:700; font-size:0.85rem;
  letter-spacing:0.04em;
  padding:15px 32px; border-radius:999px;
  background:#F5EAE0; color:#4A160F; border:1px solid #F5EAE0;
  text-decoration:none;
  transition:background .15s ease, color .15s ease;
}
.planet-btn svg{ width:16px; height:16px; flex:none; }
.planet-btn:hover{ background:transparent; color:#F5EAE0; }

/* ---------- Choose your workshop ---------- */
.planet-variants{
  position:relative; z-index:2;
  width:min(760px, calc(100% - 40px)); margin:0 auto 56px;
  text-align:center;
}
.planet-variants .eyebrow{ color:rgba(245,234,224,0.7); }
.planet-variants h2{
  font-family:'Fraunces',serif; font-weight:700; text-transform:uppercase;
  font-size:clamp(1.5rem, 3vw, 2rem); color:#F5EAE0; margin-top:8px;
}
.variant-grid{
  margin-top:28px;
  display:grid; grid-template-columns:1fr 1fr; gap:20px;
  text-align:left;
}
.variant-card{
  background:#F5EAE0; border-radius:16px;
  padding:26px 24px;
  box-shadow:0 16px 40px rgba(0,0,0,0.22);
  cursor:pointer; outline:2px solid transparent; outline-offset:3px;
  transition:transform .15s ease, box-shadow .15s ease, outline-color .15s ease;
}
.variant-card:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 48px rgba(0,0,0,0.3);
}
.variant-card:focus-visible{ outline-color:#F5EAE0; }
.variant-card.is-active{ outline-color:#4A160F; }
.variant-card h3{
  font-family:'Fraunces',serif; font-weight:700;
  font-size:1.2rem; color:#4A160F; line-height:1.2;
}
.variant-card p{
  margin-top:10px; font-family:'Karla',sans-serif; font-size:0.92rem;
  color:rgba(74,22,15,0.85); line-height:1.5;
}
.variant-link{
  display:inline-flex; align-items:center; gap:6px; margin-top:16px;
  font-family:'Karla',sans-serif; font-weight:700; font-size:0.78rem;
  letter-spacing:0.04em; text-transform:uppercase;
  color:#4A160F;
}
.variant-link svg{ width:14px; height:14px; flex:none; transition:transform .15s ease; }
.variant-card:hover .variant-link svg{ transform:translateX(3px); }
@media (max-width:640px){
  .variant-grid{ grid-template-columns:1fr; }
}

/* ---------- What's Included ---------- */
.planet-included{
  position:relative; z-index:2;
  width:min(600px, calc(100% - 40px)); margin:0 auto 90px;
  padding:36px 24px 40px;
  text-align:center;
  scroll-margin-top:24px;
  background:#F5EAE0;
  border:1px solid rgba(74,22,15,0.15);
  border-radius:18px;
  box-shadow:0 20px 50px rgba(0,0,0,0.25);
}
.planet-included .eyebrow{ color:rgba(74,22,15,0.65); }
.planet-included h2{
  font-family:'Fraunces',serif; font-weight:700; text-transform:uppercase;
  font-size:clamp(1.5rem, 3vw, 2rem); color:#4A160F; margin-top:8px;
}
.included-list{
  list-style:none; margin:30px 0 0; padding:0;
  border-top:1px solid rgba(74,22,15,0.2);
}
.included-list li{
  display:flex; align-items:center; gap:12px;
  padding:13px 2px;
  border-bottom:1px solid rgba(74,22,15,0.2);
  font-family:'Karla',sans-serif; font-size:0.98rem; color:#4A160F;
  text-align:left;
}
.included-list li::before{
  flex:none; width:20px; height:20px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:0.65rem; font-weight:700; line-height:1;
}
.included-list li.yes::before{
  content:"\2713"; background:#4A160F; color:#F5EAE0;
}
.included-list li.no{ color:rgba(74,22,15,0.5); }
.included-list li.no::before{
  content:"\2715"; background:transparent; border:1.5px solid rgba(74,22,15,0.4); color:rgba(74,22,15,0.5);
}
.included-list li.optional::before{
  content:"+"; background:transparent; border:1.5px solid #4A160F; color:#4A160F;
}
.tag-optional{
  margin-left:auto; flex:none;
  font-family:'Karla',sans-serif; font-weight:700; font-size:0.68rem;
  letter-spacing:0.06em; text-transform:uppercase;
  color:#4A160F; border:1px solid rgba(74,22,15,0.4);
  border-radius:999px; padding:3px 10px;
}
.included-note{
  margin-top:22px; padding:13px 18px;
  background:rgba(74,22,15,0.07);
  border:1px solid rgba(74,22,15,0.25);
  border-radius:8px;
  font-family:'Karla',sans-serif; font-weight:700; font-size:0.85rem;
  color:#4A160F; text-transform:uppercase; letter-spacing:0.03em;
}
.planet-included .planet-btn{
  margin-top:30px;
  background:#4A160F; color:#F5EAE0; border-color:#4A160F;
}
.planet-included .planet-btn:hover{ background:transparent; color:#4A160F; }

/* ---------- theme the persistent header/footer while this page is open ---------- */
body:has(#page-paella-workshop:not([hidden])){
  background:#4A160F;
}
body:has(#page-paella-workshop:not([hidden])) header{
  background:rgba(74,22,15,0.94);
  border-bottom-color:rgba(245,234,224,0.18);
}
body:has(#page-paella-workshop:not([hidden])) header .logo-mark{
  filter:brightness(0) invert(1);
}
body:has(#page-paella-workshop:not([hidden])) header .navlinks a:not(.btn){
  color:rgba(245,234,224,0.8);
}
body:has(#page-paella-workshop:not([hidden])) header .navlinks a:not(.btn):hover{
  color:#F5EAE0; border-color:#F5EAE0;
}
body:has(#page-paella-workshop:not([hidden])) header .btn-dark{
  background:#F5EAE0; color:#4A160F;
}
body:has(#page-paella-workshop:not([hidden])) header .btn-dark:hover{
  background:transparent; color:#F5EAE0; border-color:#F5EAE0;
}
body:has(#page-paella-workshop:not([hidden])) footer{
  background:#4A160F;
  border-top-color:rgba(245,234,224,0.18);
}
body:has(#page-paella-workshop:not([hidden])) footer .foot-left .logo-mark{
  filter:brightness(0) invert(1);
}
body:has(#page-paella-workshop:not([hidden])) footer .foot-left p{ color:rgba(245,234,224,0.6); }
body:has(#page-paella-workshop:not([hidden])) footer .foot-right a{ color:rgba(245,234,224,0.75); }
body:has(#page-paella-workshop:not([hidden])) footer .foot-right a:hover{ color:#F5EAE0; }

@media (max-width:720px){
  .planet-stage{
    height:auto; padding-block:24px 48px;
    display:flex; flex-direction:column; align-items:center;
  }
  .planet-photo{
    position:relative; top:auto; left:auto; transform:none;
    width:min(240px, 56vw); order:-3; margin-bottom:28px;
  }
  .planet-float{
    position:static; max-width:none; width:100%;
    margin:0 0 14px 0 !important; transform:none !important; text-align:center;
  }
  .planet-float--title{ order:-2; }
  .planet-cta{ position:static; order:-1; margin:0 0 28px; transform:none; }
  .planet-float.type-tag{ display:none; }
}