.din-shutt{
  --ink:#f4efe6; --muted:#a39c90; --accent:#d9a23a; --line:rgba(244,239,230,.16);
  --reveal:560ms; --ease:cubic-bezier(.76,0,.24,1); --h:760px;
  position:relative; width:100%; height:var(--h); max-height:90vh;
  overflow:hidden; background:#000; perspective:1600px;
  font-family:"DM Mono",ui-monospace,Menlo,Consolas,monospace; color:var(--ink);
  touch-action:pan-y; border-radius:8px;
}
.din-shutt *{box-sizing:border-box;margin:0;padding:0}
.din-shutt .ds-base{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04);animation:dsKb 6s var(--ease) forwards;background-color:#0b0a09;}
@keyframes dsKb{to{transform:scale(1)}}
.din-shutt .ds-base::after,.din-shutt .ds-face::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,7,6,.10) 0%,rgba(8,7,6,.30) 45%,rgba(8,7,6,.82) 100%);}
.din-shutt .ds-shutters{position:absolute;inset:0;display:flex;pointer-events:none;transform-style:preserve-3d;}
.din-shutt .ds-shutter{height:100%;transform-origin:center center;transform:rotateY(115deg);backface-visibility:hidden;position:relative;will-change:transform;}
.din-shutt .ds-face{position:absolute;inset:0;background-repeat:no-repeat;box-shadow:inset 1px 0 0 rgba(0,0,0,.25);}
.din-shutt .ds-shutters.reveal .ds-shutter{transform:rotateY(0deg);transition:transform var(--reveal) var(--ease);}
.din-shutt .ds-stage{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:clamp(24px,5vw,64px);z-index:5;pointer-events:none;}
.din-shutt .ds-caption{max-width:min(60ch,86%)}
.din-shutt .ds-caption .ds-btn{pointer-events:auto}
.din-shutt .ds-eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;}
.din-shutt .ds-eyebrow::before{content:"";width:34px;height:1px;background:var(--accent)}
.din-shutt .ds-title{font-family:"Fraunces",Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(36px,7vw,104px);line-height:.92;letter-spacing:-.025em;color:var(--ink);}
.din-shutt .ds-desc{margin-top:16px;font-size:15px;line-height:1.5;color:var(--ink);opacity:.92;max-width:46ch;}
.din-shutt .ds-row{display:flex;align-items:baseline;gap:22px;margin-top:16px;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}
.din-shutt .ds-row .ds-yr{color:var(--ink)}
.din-shutt .ds-btn{display:inline-block;margin-top:22px;padding:14px 26px;border:1px solid var(--accent);border-radius:40px;color:var(--ink);text-decoration:none;font-size:12px;letter-spacing:.22em;text-transform:uppercase;transition:background .3s,color .3s;}
.din-shutt .ds-btn:hover{background:var(--accent);color:#1a1206;}
.din-shutt .ds-caption>*{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .8s var(--ease);}
.din-shutt .ds-caption.in .ds-eyebrow{opacity:1;transform:none;transition-delay:.12s}
.din-shutt .ds-caption.in .ds-title{opacity:1;transform:none;transition-delay:.22s}
.din-shutt .ds-caption.in .ds-desc{opacity:1;transform:none;transition-delay:.30s}
.din-shutt .ds-caption.in .ds-row{opacity:1;transform:none;transition-delay:.38s}
.din-shutt .ds-caption.in .ds-btn{opacity:1;transform:none;transition-delay:.46s}
.din-shutt .ds-topbar{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:clamp(18px,3vw,32px) clamp(24px,5vw,64px);pointer-events:none;}
.din-shutt .ds-logo{font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:22px;letter-spacing:-.02em}
.din-shutt .ds-logo b{color:var(--accent)}
.din-shutt .ds-toptag{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.din-shutt .ds-controls{position:absolute;right:clamp(24px,5vw,64px);bottom:clamp(24px,5vw,64px);z-index:7;display:flex;align-items:center;gap:18px;}
.din-shutt .ds-count{font-size:13px;letter-spacing:.18em;color:var(--muted)}
.din-shutt .ds-count b{color:var(--ink);font-weight:500}
.din-shutt .ds-nav{display:flex;gap:10px}
.din-shutt .ds-nav button{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink);cursor:pointer;font-size:18px;line-height:1;display:grid;place-items:center;transition:background .3s,border-color .3s,transform .3s;}
.din-shutt .ds-nav button:hover{background:var(--accent);border-color:var(--accent);color:#1a1206;transform:translateY(-2px)}
.din-shutt .ds-nav button:active{transform:scale(.94)}
.din-shutt .ds-dots{position:absolute;left:clamp(24px,5vw,64px);bottom:clamp(24px,5vw,64px);z-index:7;display:flex;gap:10px;align-items:center;}
.din-shutt .ds-dot{height:3px;width:30px;border:0;padding:0;cursor:pointer;border-radius:2px;background:var(--line);transition:width .4s var(--ease),background .4s}
.din-shutt .ds-dot.on{width:60px;background:var(--accent)}
@media(max-width:640px){
  .din-shutt .ds-controls{left:clamp(20px,5vw,64px);right:auto;bottom:20px}
  .din-shutt .ds-nav button{width:46px;height:46px}
  .din-shutt .ds-dots{display:none}
  .din-shutt .ds-row{flex-wrap:wrap;gap:6px 18px}
  .din-shutt .ds-desc{display:none}
}