/* Dizcharge — site styles. Tokens from the Dizcharge design system (Agency territory). */
:root{
  --cream:#F4E7D3; --snow:#FFFAFA; --ink:#101820; --navy:#0C406B;
  --red:#FF4040; --cyan:#00FFFF; --sage:#C1D8B7;
  --display:'Yeseva One', Georgia, serif;
  --sans:'Archivo', 'Helvetica Neue', system-ui, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{color:var(--navy)} a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--cream);padding:10px 16px;z-index:100}
.skip:focus{left:8px}
.wrap{max-width:1280px;margin:0 auto;padding-left:24px;padding-right:24px}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:var(--cream);border-bottom:2px solid var(--ink)}
.nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px;padding-top:14px;padding-bottom:14px}
.logo{display:inline-flex;align-items:center;font-weight:900;font-size:26px;letter-spacing:.02em;color:var(--ink);text-decoration:none}
.logo svg{margin:0 1px}
.nav-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 26px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.nav-links a{color:var(--ink);text-decoration:none;padding:12px 0}
.nav-links a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--red)}
.nav-links a.btn{padding:12px 20px;color:var(--cream)}

/* Type */
h1,h2,h3{margin:0;font-weight:900;text-transform:uppercase}
h1{font-size:clamp(42px,6.2vw,92px);line-height:.95;letter-spacing:-.01em}
h2{font-size:clamp(34px,4.6vw,58px);line-height:1}
h3{font-size:22px;line-height:1.1}
p{margin:0;font-weight:300;line-height:1.55}
.serif{font-family:var(--display);font-weight:400;text-transform:none}
.red{color:var(--red)} .cyan{color:var(--cyan)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--navy)}
.lead{font-size:20px;line-height:1.5;max-width:540px}
.muted{font-size:14px}

/* Buttons */
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;padding:16px 26px;border-radius:4px;border:2px solid var(--ink);font:inherit;font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;cursor:pointer;line-height:1.2}
.btn-dark{background:var(--ink);color:var(--cream)} .btn-dark:hover{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.btn-line{background:transparent;color:var(--ink)} .btn-line:hover{background:var(--ink);color:var(--cream)}
.btn-light{background:var(--cream);border-color:var(--cream);color:var(--ink)} .btn-light:hover{background:var(--sage);border-color:var(--sage);color:var(--ink)}
.btn-line-light{background:transparent;border-color:var(--cream);color:var(--cream);text-transform:none} .btn-line-light:hover{background:var(--cream);color:var(--ink)}

/* Hero */
.hero{display:flex;flex-wrap:wrap;gap:48px;align-items:center;padding-top:56px;padding-bottom:56px}
.hero-copy{flex:999 1 520px;min-width:0;display:flex;flex-direction:column;gap:26px}
.hero-side{flex:1 1 400px;min-width:0;position:relative}
.sq{position:absolute;width:28px;height:28px;background:var(--red)}

/* Service stack (home hero) */
.svc-stack{display:flex;flex-direction:column;gap:12px}
.svc{display:flex;align-items:center;gap:20px;padding:22px 24px;border:2px solid var(--ink);text-decoration:none;transition:transform .15s ease}
.svc:hover{transform:translateX(6px)}
.svc .ico{flex:none;width:56px;height:56px;border:2px solid currentColor;display:flex;align-items:center;justify-content:center}
.svc .txt{flex:1 1 auto;display:flex;flex-direction:column;gap:4px}
.svc .t{font-weight:900;font-size:22px;text-transform:uppercase}
.svc .d{font-size:14px;font-weight:300}
.svc .arr{font-weight:900;font-size:22px}
.svc-dark{background:var(--ink);color:var(--cream)} .svc-dark:hover{color:var(--cream)} .svc-dark .ico{color:var(--cyan)}
.svc-navy{background:var(--navy);border-color:var(--navy);color:var(--cream)} .svc-navy:hover{color:var(--cream)}
.svc-snow{background:var(--snow);color:var(--ink)} .svc-snow .ico{color:var(--red)}

/* Clients */
.clients{background:var(--ink);color:var(--cream)}
.clients .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 36px;padding-top:30px;padding-bottom:30px}
.clients .label{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--sage)}
.clients ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:14px 36px;font-weight:900;font-size:17px;letter-spacing:.04em;text-transform:uppercase}
.clients img{height:32px;width:auto}

/* Sections */
.section{padding-top:96px;padding-bottom:72px}
.section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:40px}
.section-head p{max-width:420px}
.band{background:var(--navy);color:var(--cream)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px;padding-top:64px;padding-bottom:64px}
.stat{display:flex;flex-direction:column;gap:10px}
.stat .big{font-weight:900;font-size:30px;line-height:1.1;text-transform:uppercase}
.stat .num{font-size:56px;line-height:1}
.ruled{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}

/* Work */
.work-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.work{display:flex;flex-direction:column;gap:12px}
.thumb{aspect-ratio:16/10;background:var(--ink);color:var(--cream);display:flex;align-items:flex-end;padding:16px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;overflow:hidden}
.thumb.alt{background:var(--navy)}
.thumb{position:relative;padding:0}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.work:hover .thumb img{transform:scale(1.04)}
.work .cat{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--navy)}
.work h3{font-size:22px;text-transform:none;font-weight:800}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.steps li{border-top:4px solid var(--ink);padding-top:20px;display:flex;flex-direction:column;gap:10px}
.steps li:last-child{border-top-color:var(--red)}
.steps b{font-weight:900;font-size:15px;letter-spacing:.12em}

/* Service cards (inner pages) */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;background:var(--ink);border:2px solid var(--ink)}
@media (max-width:960px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.cards{grid-template-columns:1fr}}
.cards > div{background:var(--snow);padding:32px;display:flex;flex-direction:column;gap:12px}
.cards > div.hl{background:var(--navy);color:var(--cream)}
.cards > div.hl a{color:var(--cream);font-weight:800}

/* Reel */
.reel{background:var(--snow);padding:14px;border:6px dotted var(--cream);outline:2px solid var(--ink)}
.reel .frame{background:var(--ink);color:var(--cream);aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.reel .frame-img{position:relative;display:block;padding:0;overflow:hidden}
.reel .frame-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.yt{position:relative;aspect-ratio:16/9;background:var(--ink);overflow:hidden}
.yt img,.yt iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.yt-play{position:absolute;inset:0;margin:auto;width:88px;height:88px;border-radius:999px;border:3px solid var(--cyan);background:rgba(16,24,32,.55);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,border-color .2s}
.yt:hover .yt-play,.yt-play:focus-visible{background:var(--red);border-color:var(--red)}
.yt:hover .yt-play path{fill:var(--cream)}
.reels{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}
.reels .instagram-media{flex:1 1 320px;max-width:420px!important;min-width:280px!important;margin:0!important;background:var(--snow)!important;border:2px solid var(--ink)!important;border-radius:0!important;padding:16px}
.play{width:88px;height:88px;border-radius:999px;border:3px solid var(--cyan);display:flex;align-items:center;justify-content:center}

/* Photo collage */
.collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.stamp{background:var(--snow);padding:10px;border:5px dotted var(--cream);outline:2px solid var(--ink)}
.stamp > div{background:var(--ink);color:var(--cream);display:flex;align-items:flex-end;padding:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;aspect-ratio:4/3}
.stamp > div{position:relative;overflow:hidden}
.stamp > div img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stamp.tall{grid-row:span 2} .stamp.tall > div{aspect-ratio:auto;height:100%;min-height:340px}
.stamp.navy > div{background:var(--navy)} .stamp.sage > div{background:var(--sage);color:var(--ink)}
.tilt-l{transform:rotate(-2deg)} .tilt-r{transform:rotate(2deg)}

/* Content page */
.sage-hero{background:var(--sage);border-bottom:2px solid var(--ink)}
.phones{display:flex;gap:16px;justify-content:center}
.phones .stamp{flex:1 1 0;max-width:180px;padding:8px;border:0}
.phones .stamp > div{aspect-ratio:9/16;font-size:10px}
.pack{display:flex;flex-wrap:wrap;gap:48px;align-items:center;padding-top:80px;padding-bottom:80px}
.pack h2{flex:1 1 360px;font-size:clamp(32px,4vw,50px)}
.pack ul{flex:1 1 420px;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;font-size:17px;font-weight:300}
.pack li{border-top:1px solid var(--sage);padding-top:14px}
.pack strong{font-weight:800}

/* FAQ */
.faq{display:flex;flex-wrap:wrap;gap:48px}
.faq h2{flex:1 1 320px;font-size:clamp(34px,4.2vw,52px)}
.faq-list{flex:2 1 560px;min-width:0;border-top:2px solid var(--ink)}
.faq details{border-bottom:2px solid var(--ink);padding:22px 0}
.faq summary{font-weight:800;font-size:19px;cursor:pointer}
.faq details p{margin-top:14px}

/* Contact */
.contact{display:flex;flex-wrap:wrap;gap:56px}
.contact-info{flex:1 1 360px;display:flex;flex-direction:column;gap:20px}
.contact-info h2{font-size:clamp(40px,5.4vw,72px);line-height:.95}
.contact-lines{display:flex;flex-direction:column;gap:8px;font-size:16px}
.contact-lines a{font-weight:800;color:var(--ink)}
.form{flex:2 1 520px;min-width:0;background:var(--snow);border:2px solid var(--ink);padding:32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.form label{display:flex;flex-direction:column;gap:8px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.form input,.form select,.form textarea{font:inherit;font-size:16px;letter-spacing:0;text-transform:none;padding:14px;border:2px solid var(--ink);border-radius:4px;background:var(--cream);color:var(--ink)}
.form textarea{resize:vertical}
.form .full{grid-column:1/-1}
.form button{justify-self:start}
.hp{position:absolute;left:-9999px}

/* CTA + footer */
.cta{background:var(--ink);color:var(--cream)}
.cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;padding-top:80px;padding-bottom:80px}
.cta h2{font-size:clamp(36px,5vw,64px);line-height:.95}
.site-footer{background:var(--ink);color:var(--cream);border-top:1px solid var(--navy)}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:center;padding-top:44px;padding-bottom:44px}
.site-footer .logo{color:var(--cream)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.site-footer nav a{color:var(--cream);padding:8px 0}
.site-footer small{flex-basis:100%;font-size:13px;font-weight:300;color:var(--sage)}
.tag{font-size:11px;font-weight:600;letter-spacing:.22em}

/* Booking (main conversion block) */
.book{background:var(--ink);color:var(--cream)}
.book-grid{display:flex;flex-wrap:wrap;gap:48px;padding-top:88px;padding-bottom:88px;align-items:flex-start}
.book-info{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:24px}
.book-info .eyebrow{color:var(--sage)}
.book-info h2{font-size:clamp(38px,5vw,66px);line-height:.95}
.book-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:17px;font-weight:300}
.book-points li{display:flex;gap:12px;align-items:baseline;border-top:1px solid #2a3540;padding-top:12px}
.book-points b{color:var(--cyan);font-weight:900;font-size:14px;letter-spacing:.08em}
.book-alt{display:flex;flex-direction:column;gap:12px;font-size:15px;font-weight:300}
.book-alt .btns a{text-transform:none}
.book-alt a.lnk{color:var(--cream);font-weight:800}
.book-widget{flex:1.4 1 460px;min-width:0;display:flex;flex-direction:column;gap:20px}
.cal-slot{background:var(--cream);color:var(--ink);border-radius:4px;min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px;text-align:center}
.cal-slot.is-live{display:block;padding:0;min-height:0;background:var(--snow)}
.cal-slot .cal-ico{width:64px;height:64px;border:2px solid var(--ink);display:flex;align-items:center;justify-content:center}
.cal-slot strong{font-size:22px;font-weight:900;text-transform:uppercase}
.book .form{background:var(--snow);color:var(--ink);border-color:var(--snow);padding:24px}
.book .form legend{grid-column:1/-1;font-weight:900;font-size:18px;text-transform:uppercase;padding:0}
.form-done{grid-column:1/-1;font-weight:800;font-size:18px}

/* Testimonials */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.quote{background:var(--snow);border:2px solid var(--ink);padding:32px;margin:0;display:flex;flex-direction:column;gap:20px}
.quote blockquote{margin:0;font-family:var(--display);font-size:24px;line-height:1.3}
.quote figcaption{font-size:14px;font-weight:300}
.quote figcaption b{display:block;font-weight:800;font-size:15px}

/* Mobile sticky action bar */
.proof{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13px;font-weight:600;color:var(--navy)}
.proof li{display:flex;align-items:center;gap:8px}
.proof li::before{content:"";width:10px;height:10px;background:var(--red);flex:none}
.case{background:var(--snow);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.case-grid{display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:88px;padding-bottom:88px}
.case-media{flex:1 1 280px;max-width:380px;position:relative;margin:0 auto}
.case-media .stamp > div{aspect-ratio:9/16}
.case-copy{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:24px}
.case-copy h2{font-size:clamp(32px,4.2vw,54px);line-height:1}
.case-facts{margin:0;display:flex;flex-direction:column;gap:0;border-top:2px solid var(--ink)}
.case-facts > div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid #d9cbb5}
.case-facts dt{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);padding-top:3px}
.case-facts dd{margin:0;font-weight:300;line-height:1.55}
.why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.why > div{display:flex;flex-direction:column;gap:10px;border-top:4px solid var(--ink);padding-top:20px}
.why b{color:var(--red);font-weight:900;letter-spacing:.12em;font-size:14px}
.why h3{font-size:20px}
.about{background:var(--navy);color:var(--cream)}
.about-grid{display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:88px;padding-bottom:88px}
.about-copy{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:20px}
.about-copy .eyebrow{color:var(--sage)}
.about-copy h2{font-size:clamp(34px,4.6vw,58px)}
.about-facts{flex:1 1 300px;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--cream);border:2px solid var(--cream)}
.about-facts li{background:var(--navy);padding:22px;display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:300}
.about-facts .big{font-weight:900;font-size:34px;line-height:1;white-space:nowrap}
@media (max-width:960px){.why{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.why{grid-template-columns:1fr}.case-facts > div{grid-template-columns:1fr;gap:4px}}
.showcase{padding-top:96px;padding-bottom:88px}
.show-grid{display:grid;grid-template-columns:2.1fr 1fr;gap:20px}
.show-grid figure{margin:0;position:relative;overflow:hidden;background:var(--ink)}
.show-grid img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.show-grid figure:hover img{transform:scale(1.03)}
.show-main{aspect-ratio:1600/1088}
.show-grid figcaption{position:absolute;left:0;bottom:0;background:var(--ink);color:var(--cream);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:10px 14px}
@media (max-width:760px){.show-grid{grid-template-columns:1fr}.show-side{aspect-ratio:4/5}}
.price-band{background:var(--snow);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.price-grid{display:flex;flex-wrap:wrap;gap:24px 56px;align-items:center;justify-content:space-between;padding-top:64px;padding-bottom:64px}
.price-grid h2{font-size:clamp(32px,4.4vw,56px)}
.price-copy{flex:1 1 380px;max-width:520px;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.hero-photo{max-width:560px;margin:0 auto}
.hero-photo figure{margin:0;padding:12px}
.hero-photo figure > div{aspect-ratio:6/5;position:relative;overflow:hidden;background:var(--ink)}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-photo figcaption{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:10px 2px 0;color:var(--ink)}
.svc-row{padding-bottom:56px}
.hero h1{font-size:clamp(40px,5.6vw,82px)}
@media (max-width:900px){.hero-photo{order:-1;max-width:460px}.hero{padding-top:28px}}
.svc-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:900px){.svc-3{grid-template-columns:1fr}}
.partner{background:var(--ink);color:var(--cream)}
.partner-grid{display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:88px;padding-bottom:88px}
.partner-copy{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:20px}
.partner-copy .eyebrow{color:var(--sage)}
.partner-copy h2{font-size:clamp(32px,4.4vw,56px)}
.partner-copy a:not(.btn){color:var(--cyan)}
.partner-logo{display:inline-block;align-self:flex-start}
.partner-logo img{height:56px;width:auto;filter:brightness(0) invert(1);display:block}
.partner-tag{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.partner .btn-dark{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.partner-facts{flex:1 1 380px;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--navy);border:2px solid var(--navy)}
.partner-facts li{background:var(--ink);padding:22px;display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:300}
.partner-facts .big{font-weight:900;font-size:30px;line-height:1;color:var(--cyan);white-space:nowrap}
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--cream);border-top:2px solid var(--ink)}
  .mbar a{flex:1 1 0;text-align:center;padding:14px 8px;font-size:14px}
  body{padding-bottom:78px}
}

@media (max-width:640px){
  .site-header{position:static}
  .nav-links{gap:0 18px;font-size:12px}
  .section{padding-top:64px;padding-bottom:48px}
  .svc{padding:18px}
  .svc .ico{width:48px;height:48px}
  .form{padding:20px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.svc,.thumb img{transition:none}}
