/* ==========================================================================
   DDF Events — product category pages (dance floors, welcome signs, seating
   charts, stationery, custom structures). Same system as /products:
   ≥1024px sizes are 1440-comp values × --u; below that, the mobile system.
   Pages are generated from their original content; see git history.
   ========================================================================== */
:root { --bg:#0F0D0E; --surface:#1A1617; --ink:#F5F1EC; --accent:#E07A36; --accent-deep:#B4521A; }
@media (min-width:1024px) { :root { --u: min(1px, 0.0694444vw); } }
html { background: var(--bg); }
body.ddf { margin:0; background:var(--bg); color:var(--ink); font-family:'Barlow',sans-serif; overflow-x:clip; }
.cat a { color:var(--ink); text-decoration:none; }
.cat a:hover { color:#F6C9A6; }
.cat *, .cat *::before, .cat *::after { box-sizing:border-box; }
.cat img { display:block; }
.cat :focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:6px; }
.cat h1, .cat h2, .cat h3, .cat p, .cat figure, .cat dl, .cat dd { margin:0; }

.eyebrow{display:flex;gap:14px;align-items:center;font-size:14px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,241,236,.7)}
.eyebrow::before{content:"";flex:none;width:44px;height:2px;background:var(--accent)}
.acc{color:var(--accent)}
.light{background:var(--ink);color:var(--bg)}
.light .eyebrow{color:rgba(15,13,14,.65)}
.light .acc{color:var(--accent-deep)}
.light a{color:var(--bg)}
.h2{font-size:clamp(38px,calc(30.6px + 1.9vw),50px);font-weight:600;line-height:.95;letter-spacing:-.03em;text-transform:uppercase}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:14px 22px;border-radius:999px;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .18s ease,border-color .18s ease,transform .18s cubic-bezier(.22,1,.36,1)}
.btn:active{transform:scale(.97)}
.btn--accent{background:var(--accent);color:var(--bg)!important}
.btn--accent:hover{background:#EA8A48}
.btn--ghost{border:1px solid rgba(245,241,236,.35);font-weight:600}
.btn--ghost:hover{border-color:rgba(245,241,236,.7)}
.btn--dark{background:var(--bg);color:var(--ink)!important}
.btn--dark:hover{background:#2A2426}
.btn svg{width:20px;height:20px}
.tlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tlink svg{width:20px;height:20px}

/* ── Hero (like /products) ── */
.c-hero{position:relative;overflow:hidden;padding:48px 20px 44px}
.c-hero__img{position:absolute;inset:0;opacity:.35}
.c-hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-hero__fade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,13,14,.55) 0%,var(--bg) 92%)}
.c-hero__in{position:relative;display:flex;flex-direction:column;gap:22px}
.c-h1{font-size:clamp(50px,calc(26.9px + 5.92vw),85px);font-weight:600;line-height:.88;letter-spacing:-.04em;text-transform:uppercase}
.c-h1 em{font-style:normal;color:var(--accent);display:block}
.c-hero__p{max-width:560px;font-size:17px;line-height:1.6;color:rgba(245,241,236,.75)}
.c-actions{display:flex;flex-wrap:wrap;gap:10px}

/* ── Section shell ── */
.c-sec{padding:64px 20px;display:flex;flex-direction:column;gap:32px}
.c-head{display:flex;flex-direction:column;gap:18px}
.c-head__row{display:flex;flex-direction:column;gap:18px}
.c-split{display:flex;flex-direction:column;gap:28px}

/* Real work */
.c-work{display:grid;grid-template-columns:1fr;gap:20px}
.c-work--1 .c-fig__ph{aspect-ratio:16/9}
.c-fig{display:flex;flex-direction:column;gap:14px}
.c-fig__ph{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;background:var(--surface)}
.c-fig__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.22,1,.36,1)}
.c-fig:hover .c-fig__ph img{transform:scale(1.04)}
.c-fig figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,241,236,.7)}
.light .c-fig figcaption{color:rgba(15,13,14,.7)}
.c-fig figcaption svg{width:18px;height:18px;flex:none}

/* What's possible */
.c-caps{display:grid;grid-template-columns:1fr;gap:0}
.c-cap{display:flex;flex-direction:column;gap:10px;padding:22px 0;border-top:1px solid rgba(245,241,236,.16)}
.light .c-cap{border-top-color:rgba(15,13,14,.14)}
.c-cap__n{font-size:14px;font-weight:600;color:var(--accent)}
.light .c-cap__n{color:var(--accent-deep)}
.c-cap h3{font-size:24px;font-weight:600;text-transform:uppercase;letter-spacing:-.01em;line-height:1.05}
.c-cap p{font-size:16px;line-height:1.6;color:rgba(245,241,236,.72)}
.light .c-cap p{color:rgba(15,13,14,.72)}

/* Specifications */
.c-spec{display:flex;flex-direction:column}
.c-spec__row{display:grid;grid-template-columns:1fr;gap:6px;padding:18px 0;border-top:1px solid rgba(245,241,236,.16)}
.light .c-spec__row{border-top-color:rgba(15,13,14,.14)}
.c-spec dt{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.light .c-spec dt{color:var(--accent-deep)}
.c-spec dd{font-size:17px;line-height:1.6}

/* How it's made */
.c-steps{display:grid;grid-template-columns:1fr;gap:0;list-style:none;padding:0;margin:0}
.c-step{display:flex;flex-direction:column;gap:10px;padding:22px 0;border-top:1px solid rgba(245,241,236,.18)}
.c-step__n{font-size:14px;font-weight:600;color:var(--accent)}
.c-step h3{font-size:24px;font-weight:600;text-transform:uppercase;letter-spacing:-.01em}
.c-step p{font-size:16px;line-height:1.6;color:rgba(245,241,236,.68)}

/* FAQ */
.c-faq{display:flex;flex-direction:column}
.c-q{border-top:1px solid rgba(15,13,14,.14)}
.c-q:last-child{border-bottom:1px solid rgba(15,13,14,.14)}
.c-q summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:18px 0;cursor:pointer;list-style:none;font-size:19px;font-weight:600}
.c-q summary::-webkit-details-marker{display:none}
.c-q summary::after{content:"+";flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:999px;border:1px solid rgba(15,13,14,.25);font-size:22px;font-weight:400;line-height:1;transition:transform .25s cubic-bezier(.22,1,.36,1)}
.c-q[open] summary::after{transform:rotate(45deg)}
.c-q summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.c-q p{padding:0 0 22px;max-width:760px;font-size:17px;line-height:1.6;color:rgba(15,13,14,.72)}

/* Closing panel */
.c-close{padding:24px 20px 72px}
.c-close__panel{border-radius:28px;background:var(--accent);color:var(--bg);padding:36px 24px;display:flex;flex-direction:column;gap:22px}
.c-close__h{font-size:clamp(42px,calc(29.7px + 3.15vw),62px);font-weight:600;line-height:.9;letter-spacing:-.035em;text-transform:uppercase}
.c-close__p{max-width:520px;font-size:17px;line-height:1.55}
.c-close .tlink{color:var(--bg)!important}
.c-close .tlink:hover{color:#2A2426!important}

@media (min-width:600px) and (max-width:1023px){
  .c-work{grid-template-columns:1fr 1fr}
  .c-caps,.c-steps{grid-template-columns:1fr 1fr;column-gap:32px}
  .c-spec__row{grid-template-columns:200px 1fr;gap:24px}
}

/* ======================================================================
   Desktop ≥1024px — 1440 comp values × --u
   ====================================================================== */
@media (min-width:1024px){
  .eyebrow{gap:calc(14*var(--u));font-size:max(11px,calc(14*var(--u)))}
  .eyebrow::before{width:calc(44*var(--u))}
  .h2{font-size:calc(72*var(--u))}
  .btn{min-height:0;padding:calc(18*var(--u)) calc(28*var(--u));font-size:max(12px,calc(15*var(--u)))}
  .tlink{font-size:max(12px,calc(15*var(--u)))}

  .c-hero{min-height:calc(620*var(--u));padding:calc(90*var(--u)) calc(64*var(--u)) calc(72*var(--u));display:flex;align-items:flex-end}
  .c-hero__img{left:auto;width:calc(760*var(--u));opacity:.55}
  .c-hero__fade{left:auto;width:calc(760*var(--u));background:linear-gradient(90deg,var(--bg) 0%,rgba(15,13,14,.2) 60%,rgba(15,13,14,.6) 100%)}
  .c-hero__in{gap:calc(30*var(--u));width:100%}
  .c-h1{font-size:calc(120*var(--u));max-width:calc(1000*var(--u))}
  .c-hero__p{width:calc(560*var(--u));max-width:none;font-size:max(15px,calc(20*var(--u)))}
  .c-actions{gap:calc(12*var(--u))}

  .c-sec{padding:calc(120*var(--u)) calc(64*var(--u));gap:calc(56*var(--u))}
  .c-head{gap:calc(24*var(--u))}
  .c-head__row{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:calc(40*var(--u))}
  .c-head__row .h2{max-width:calc(900*var(--u))}

  .c-work{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(40*var(--u)) calc(20*var(--u))}
  .c-work--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-work--1{grid-template-columns:1fr}
  .c-work--1 .c-fig__ph{aspect-ratio:21/9}
  .c-fig{gap:calc(16*var(--u))}
  .c-fig__ph{border-radius:calc(24*var(--u))}
  .c-fig figcaption{font-size:max(11px,calc(14*var(--u)))}

  .c-split{flex-direction:row;gap:calc(80*var(--u));align-items:flex-start}
  .c-split > .c-head{width:calc(460*var(--u));flex:none;position:sticky;top:calc(40*var(--u))}
  .c-split > :last-child{flex-grow:1;min-width:0}

  .c-caps{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 calc(32*var(--u))}
  .c-cap{gap:calc(12*var(--u));padding:calc(26*var(--u)) 0 0}
  .c-cap__n{font-size:max(11px,calc(14*var(--u)))}
  .c-cap h3{font-size:calc(30*var(--u))}
  .c-cap p{font-size:max(14px,calc(17*var(--u)))}

  .c-spec__row{grid-template-columns:calc(220*var(--u)) 1fr;gap:calc(32*var(--u));padding:calc(24*var(--u)) 0}
  .c-spec dt{font-size:max(11px,calc(13*var(--u)));padding-top:calc(4*var(--u))}
  .c-spec dd{font-size:max(15px,calc(19*var(--u)))}

  .c-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 calc(32*var(--u))}
  .c-step{gap:calc(10*var(--u));padding:calc(22*var(--u)) 0 0}
  .c-step__n{font-size:max(11px,calc(14*var(--u)))}
  .c-step h3{font-size:calc(28*var(--u))}
  .c-step p{font-size:max(14px,calc(16*var(--u)))}

  .c-q summary{min-height:0;padding:calc(26*var(--u)) 0;font-size:max(16px,calc(22*var(--u)))}
  .c-q p{padding-bottom:calc(26*var(--u));font-size:max(14px,calc(17*var(--u)))}

  .c-close{padding:calc(60*var(--u)) calc(64*var(--u)) calc(100*var(--u))}
  .c-close__panel{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:calc(64*var(--u));border-radius:calc(36*var(--u));padding:calc(72*var(--u))}
  .c-close__h{font-size:calc(104*var(--u));max-width:calc(700*var(--u))}
  .c-close__r{display:flex;flex-direction:column;gap:calc(24*var(--u));width:calc(460*var(--u));flex:none}
  .c-close__p{font-size:max(15px,calc(19*var(--u)))}
}
@media (max-width:1023px){ .c-close__r{display:flex;flex-direction:column;gap:22px} }
@media (prefers-reduced-motion:reduce){ .btn,.c-fig__ph img,.c-q summary::after{transition:none} .c-fig:hover .c-fig__ph img{transform:none} }