.cdt{ --stone:#EDEADD; --paper:#FBFAF2; --paper-deep:#F3F0E2; --ink:#202B29; --ink-soft:#4A5350; --teal:#1D6E68; --teal-deep:#134E4A; --terracotta:#C15530; --brass:#AD8A40; --brass-soft:#CDAE6E; --line:rgba(173,138,64,0.32); --line-teal:rgba(29,110,104,0.28); --shadow:0 24px 50px -28px rgba(20,30,28,0.28); --mx:50%; --my:35%; background:var(--stone); }
.cdt *{ box-sizing:border-box; }
.cdt a{ color:var(--terracotta); text-decoration:none; }
.cdt a:hover{ text-decoration:underline; }

.cdt-hero{ position:relative; padding:64px 40px 46px; overflow:hidden; isolation:isolate; border-bottom:1px solid var(--line); }
.cdt-lattice-bg{ position:absolute; inset:0; z-index:0; opacity:.55; }
.cdt-light-glow{ position:absolute; inset:0; z-index:1; pointer-events:none; background:radial-gradient(480px circle at var(--mx) var(--my), rgba(255,252,238,0.85), rgba(255,252,238,0) 68%); mix-blend-mode:soft-light; transition:background-position .05s linear; }
.cdt-hero-inner{ position:relative; z-index:2; max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.35fr 1fr; gap:30px; align-items:center; }
@media(max-width:940px){ .cdt-hero-inner{ grid-template-columns:1fr; } }

.cdt-eyebrow{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.cdt-eyebrow .glyph{ width:26px; height:26px; color:var(--terracotta); flex-shrink:0; }
.cdt-eyebrow span{ font-family:'Cairo',sans-serif; font-weight:700; letter-spacing:.16em; text-transform:uppercase; font-size:12px; color:var(--teal-deep); }
.cdt-eyebrow .rule{ flex:1; max-width:60px; height:1px; background:var(--line); }

.cdt-hero h1{ font-family:'Cairo',sans-serif; font-weight:800; font-size:clamp(32px,4.6vw,54px); line-height:1.05; letter-spacing:-.015em; color:var(--ink); margin:0 0 18px; }
.cdt-hero h1 em{ font-style:normal; color:var(--teal); position:relative; text-decoration:none; }
.cdt-hero h1 em::after{ content:''; position:absolute; left:0; right:-2%; bottom:2px; height:9px; background:var(--brass-soft); opacity:.4; z-index:-1; }

.cdt-hero .tagline{ font-family:'Amiri',serif; font-style:italic; font-size:18px; line-height:1.65; color:var(--ink-soft); max-width:44ch; margin:0 0 30px; }

.cdt-badge-row{ display:flex; align-items:center; gap:14px; }
.cdt-stamp{ width:64px; height:64px; flex-shrink:0; transform:scale(1.5) rotate(-12deg); opacity:0; }
.cdt-stamp.stamped{ animation:cdtStamp .6s cubic-bezier(.2,1.4,.4,1) forwards; }
.cdt-badge-text{ font-family:'Cairo',sans-serif; }
.cdt-badge-text .t1{ font-weight:700; font-size:13.5px; color:var(--terracotta); display:block; }
.cdt-badge-text .t2{ font-size:12.5px; color:var(--ink-soft); }

.cdt-girih{ position:relative; width:100%; aspect-ratio:1/1; max-width:400px; margin:0 auto; }
.cdt-girih svg{ width:100%; height:100%; overflow:visible; }
.cdt-guide{ fill:none; stroke:var(--brass); stroke-width:.6; stroke-dasharray:4 3; opacity:0; animation:cdtGuideIn 1s ease forwards; }
.cdt-strap{ fill:none; stroke:var(--teal); stroke-width:2; stroke-dasharray:var(--len); stroke-dashoffset:var(--len); animation:cdtDraw 1.6s cubic-bezier(.65,0,.35,1) forwards; }
.cdt-strap-fill{ fill:var(--terracotta); opacity:0; animation:cdtFillIn .6s ease forwards; }

.cdt-stats{ max-width:1200px; margin:-30px auto 0; padding:0 40px; position:relative; z-index:5; display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:16px; justify-items:center; }
@media(max-width:760px){ .cdt-stats{ grid-template-columns:1fr 1fr; } }
.cdt-stat{ background:var(--paper); border:1px solid var(--line); border-radius:60px 60px 6px 6px; padding:26px 18px 18px; text-align:center; box-shadow:var(--shadow); }
.cdt-stat .ic{ width:22px; height:22px; color:var(--teal); margin:0 auto 10px; display:block; }
.cdt-stat .k{ font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:6px; }
.cdt-stat .v{ font-family:'Cairo',sans-serif; font-weight:700; font-size:16px; color:var(--ink); }
.cdt-stat.fee .v{ color:var(--terracotta); }

.cdt-layout{ max-width:1200px; margin:0 auto; padding:44px 40px 100px; display:grid; grid-template-columns:1.5fr 1fr; gap:32px; }
@media(max-width:900px){ .cdt-layout{ grid-template-columns:1fr; } }
.cdt-col{ display:flex; flex-direction:column; gap:16px; }

.cdt-divider{ display:flex; align-items:center; gap:14px; margin:22px 0 4px; }
.cdt-divider:first-child{ margin-top:0; }
.cdt-divider .rule{ flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent); }
.cdt-divider .rule.r{ transform:scaleX(-1); }
.cdt-divider .star{ width:20px; height:20px; color:var(--brass); flex-shrink:0; }

.cdt-panel{ background:var(--paper); border:1px solid var(--line); padding:34px 36px 32px; position:relative; box-shadow:var(--shadow); clip-path:polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%); }
.cdt-panel::before{ content:''; position:absolute; top:0; right:0; width:30px; height:30px; background:var(--brass-soft); opacity:.35; clip-path:polygon(100% 0,0 0,100% 100%); }
.cdt-panel h2{ font-family:'Cairo',sans-serif; font-weight:700; font-size:24px; color:var(--teal-deep); margin:14px 0 14px; letter-spacing:-.01em; }
.cdt-panel p{ font-size:16.5px; line-height:1.75; color:#3a3630; margin:0; }

.cdt-niche-tab{ position:absolute; top:-1px; left:28px; transform:translateY(-100%); background:var(--teal-deep); color:var(--paper); padding:8px 16px 20px; border-radius:10px 10px 0 0; display:flex; align-items:center; gap:8px; }
.cdt-niche-tab svg{ width:16px; height:16px; }
.cdt-niche-tab span{ font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }

.cdt-tiles{ display:grid; grid-template-columns:1fr 1fr; gap:16px 14px; margin-top:8px; padding-bottom:36px; }
@media(max-width:560px){ .cdt-tiles{ grid-template-columns:1fr; padding-bottom:0; } }
.cdt-tile{ background:linear-gradient(160deg,rgba(29,110,104,.07),rgba(29,110,104,.015)); border:1px solid var(--line-teal); border-radius:3px; padding:16px 18px 16px 44px; font-family:'Cairo',sans-serif; font-weight:600; font-size:14.5px; color:var(--teal-deep); position:relative; transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .35s,border-color .35s; cursor:default; }
.cdt-tile:nth-child(1){ --tier:0px; }
.cdt-tile:nth-child(2){ --tier:26px; }
.cdt-tile:nth-child(3){ --tier:14px; }
.cdt-tile:nth-child(4){ --tier:40px; }
.cdt-tile{ transform:translateY(var(--tier)); }
@media(max-width:560px){ .cdt-tile{ transform:none !important; } }
.cdt-tile:hover{ transform:translateY(calc(var(--tier) - 4px)); border-color:var(--brass); box-shadow:0 16px 30px -16px rgba(32,43,41,.25); }
@media(max-width:560px){ .cdt-tile:hover{ transform:translateY(-4px) !important; } }
.cdt-tile .facet{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--brass); }
.cdt-tile:hover .facet{ color:var(--terracotta); }

.cdt-elrow{ display:flex; gap:14px; padding:13px 0; border-top:1px solid var(--line); }
.cdt-elrow:first-of-type{ border-top:none; margin-top:16px; }
.cdt-elrow .lab{ font-family:'Cairo',sans-serif; font-weight:700; font-size:13px; letter-spacing:.04em; color:var(--teal-deep); min-width:98px; flex-shrink:0; padding-top:1px; }
.cdt-elrow .val{ font-size:15.5px; color:#3a3630; line-height:1.6; }

.cdt-reg-wrap{ position:relative; }
.cdt-reg{ background:var(--paper); border-radius:6px; padding:0 0 32px; position:sticky; top:24px; box-shadow:var(--shadow); overflow:hidden; border:1px solid var(--line); }
.cdt-reg-lattice{ height:14px; width:100%; display:block; }
.cdt-reg-arch{ position:relative; padding:26px 32px 22px; text-align:center; background:linear-gradient(180deg,var(--paper-deep),var(--paper)); border-bottom:1px solid var(--line); }
.cdt-reg-star{ width:42px; height:42px; margin:0 auto 12px; color:var(--teal); display:block; }
.cdt-reg-arch h3{ font-family:'Cairo',sans-serif; font-weight:700; font-size:21px; color:var(--ink); margin:0 0 8px; }
.cdt-reg-arch p{ font-size:14px; line-height:1.6; color:var(--ink-soft); max-width:30ch; margin:0 auto; }
.cdt-reg-body{ padding:24px 30px 0; }

.cdt-field{ margin-bottom:15px; }
.cdt-field label{ display:block; font-family:'Cairo',sans-serif; font-weight:600; font-size:12.5px; letter-spacing:.03em; color:var(--teal-deep); margin-bottom:6px; }
.cdt-field label .req{ color:var(--terracotta); }
.cdt-field input, .cdt-field textarea{ width:100%; background:var(--stone); border:1px solid var(--line); border-radius:3px; padding:11px 13px; font-family:'Amiri',serif; font-size:15px; color:var(--ink); outline:none; transition:border-color .25s,box-shadow .25s,background .25s; }
.cdt-field input::placeholder, .cdt-field textarea::placeholder{ color:rgba(32,43,41,.35); }
.cdt-field input:focus, .cdt-field textarea:focus{ border-color:var(--teal); background:var(--paper); box-shadow:0 0 0 3px rgba(29,110,104,.14); }
.cdt-field textarea{ resize:vertical; min-height:60px; }
.cdt-field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.cdt-otp-note{ font-size:12px; line-height:1.55; color:var(--ink-soft); margin:-5px 0 15px; }

.cdt-btn-row{ display:flex; gap:10px; margin-bottom:18px; }
.cdt-btn{ font-family:'Cairo',sans-serif; font-weight:700; font-size:13.5px; letter-spacing:.03em; border-radius:3px; padding:12px 16px; cursor:pointer; flex:1; position:relative; overflow:hidden; transition:transform .2s,box-shadow .2s; }
.cdt-btn:active{ transform:scale(.97); }
.cdt-btn-ghost{ background:transparent; border:1px solid var(--teal); color:var(--teal-deep); }
.cdt-btn-ghost:hover{ background:rgba(29,110,104,.08); }
.cdt-btn-solid{ background:var(--teal); border:1px solid var(--teal); color:var(--paper); }
.cdt-btn-solid:hover{ box-shadow:0 10px 22px -8px rgba(29,110,104,.45); }
.cdt-btn-submit{ width:100%; margin-top:4px; border:none; background:linear-gradient(135deg,var(--terracotta),#A2431F); color:var(--paper); font-size:14.5px; padding:15px; }
.cdt-btn-submit:hover{ box-shadow:0 14px 28px -10px rgba(193,85,48,.5); }
.cdt-btn-submit .shimmer{ position:absolute; inset:0; background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%); transform:translateX(-100%); }
.cdt-btn-submit:hover .shimmer{ animation:cdtShimmer 1.1s ease; }

.cdt-alert{ padding:12px 16px; border-radius:4px; margin-bottom:16px; font-size:14px; font-family:'Cairo',sans-serif; }
.cdt-alert-success{ background:rgba(29,110,104,.08); border:1px solid var(--line-teal); color:var(--teal-deep); }
.cdt-alert-danger{ background:rgba(193,85,48,.08); border:1px solid rgba(193,85,48,.28); color:var(--terracotta); }
.cdt-small{ font-size:12px; line-height:1.55; color:var(--ink-soft); margin-top:-5px; margin-bottom:15px; display:block; }

.cdt .public-otp{ background:var(--paper-deep); border:1px solid var(--line); border-radius:4px; padding:14px 16px; margin-bottom:16px; }
.cdt .public-otp__title{ font-family:'Cairo',sans-serif; font-weight:600; font-size:12px; color:var(--teal-deep); display:flex; align-items:center; gap:6px; margin-bottom:6px; }
.cdt .public-otp__status{ font-size:12px; line-height:1.5; color:var(--ink-soft); margin:0 0 10px; }
.cdt .public-otp__row{ display:flex; gap:8px; align-items:center; }
.cdt .public-otp__row input{ flex:1; background:var(--stone); border:1px solid var(--line); border-radius:3px; padding:10px 12px; font-family:'Amiri',serif; font-size:14px; color:var(--ink); outline:none; transition:border-color .25s,box-shadow .25s; }
.cdt .public-otp__row input:focus{ border-color:var(--teal); box-shadow:0 0 0 3px rgba(29,110,104,.14); }
.cdt .public-otp__actions{ display:flex; gap:6px; }
.cdt .public-otp__btn{ font-family:'Cairo',sans-serif; font-weight:700; font-size:12px; padding:10px 14px; border-radius:3px; cursor:pointer; border:1px solid var(--teal); background:var(--teal); color:var(--paper); white-space:nowrap; transition:box-shadow .2s; }
.cdt .public-otp__btn:last-child{ background:transparent; color:var(--teal-deep); }
.cdt .public-otp__btn:hover{ box-shadow:0 6px 14px -6px rgba(29,110,104,.4); }
.cdt .public-otp.is-verified{ border-color:var(--teal); background:rgba(29,110,104,.04); }
.cdt .public-otp.is-verified .public-otp__status{ color:var(--teal); }

.cdt-layout--narrow .cdt-col{ max-width:100%; flex:1 1 100%; }
.cdt-panel--media{ padding:0; overflow:hidden; }
.cdt-panel--media img{ display:block; width:100%; }

.cdt-related{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cdt-related-card{ background:var(--paper-deep); border:1px solid var(--line); border-radius:8px; overflow:hidden; text-decoration:none; transition:box-shadow .25s,border-color .25s; }
.cdt-related-card:hover{ border-color:var(--gold); box-shadow:0 10px 24px -8px rgba(0,0,0,.12); }
.cdt-related-img{ height:180px; background:#F5F0E0 center/cover no-repeat; }
.cdt-related-img video{ width:100%; height:100%; object-fit:cover; }
.cdt-related-body{ padding:14px 16px; }
.cdt-related-body h4{ margin:0; font-family:'Cairo',sans-serif; font-weight:700; font-size:15px; color:var(--ink); line-height:1.45; }
@media(max-width:900px){ .cdt-related{ grid-template-columns:1fr; gap:16px; } }

@keyframes cdtStamp{ 0%{opacity:0;transform:scale(1.5) rotate(-12deg)} 60%{opacity:1;transform:scale(.92) rotate(3deg)} 100%{opacity:1;transform:scale(1) rotate(-4deg)} }
@keyframes cdtGuideIn{ from{opacity:0} to{opacity:.55} }
@keyframes cdtDraw{ to{stroke-dashoffset:0} }
@keyframes cdtFillIn{ to{opacity:.9} }
@keyframes cdtShimmer{ to{transform:translateX(100%)} }

@media(prefers-reduced-motion:reduce){ .cdt *,.cdt *::before,.cdt *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; } }

/* ── Mobile fixes ── */
@media (max-width: 560px) {
    .cdt-hero { padding: 40px 20px 32px; }
    .cdt-layout { padding: 24px 16px 60px; }
    .cdt-stats { padding: 0 16px; }
    .cdt-panel { padding: 24px 20px 22px; }
}
@media (max-width: 900px) {
    .cdt-reg { position: static; }
}

/* ── Album detail styles ── */
#albumDetail .cdt-stats{ grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); max-width:700px; }
#albumDetail .cdt-stats .cdt-stat{ min-width:0; width:100%; }
#albumDetail .cdt-photos-wrap{ max-width:1100px; margin:0 auto; padding:0 40px 60px; }
#albumDetail .cdt-photos-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:24px; }
#albumDetail .cdt-photo-card{ border-radius:12px; overflow:hidden; border:1px solid #e2d3ab; background:#FEFCF6; transition:box-shadow .3s, transform .3s; }
#albumDetail .cdt-photo-card:hover{ box-shadow:0 16px 36px -12px rgba(20,30,28,.22); transform:translateY(-3px); }
#albumDetail .cdt-photo-card a{ display:block; }
#albumDetail .cdt-photo-card img{ width:100%; display:block; aspect-ratio:4/3; object-fit:cover; }
#albumDetail .cdt-photo-card video{ width:100%; display:block; aspect-ratio:4/3; object-fit:cover; }
#albumDetail .cdt-photo-body{ padding:14px 16px; }
#albumDetail .cdt-photo-title{ font-family:'Marcellus',serif; font-size:15px; color:#0B3D2E; }
#albumDetail .cdt-photo-date{ font-family:'Jost',sans-serif; font-size:12px; color:#6B4226; margin-top:4px; }
#albumDetail .cdt-empty{text-align:center; padding:60px 20px; color:#6B4226; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:17px; }
@media(max-width:760px){ #albumDetail .cdt-stats{ grid-template-columns:1fr 1fr; max-width:100%; } }
@media(max-width:560px){ #albumDetail .cdt-photos-wrap{ padding:0 16px 40px; } #albumDetail .cdt-photos-grid{ grid-template-columns:1fr; } }
