.ad-service { background:#f5f3ee; color:#1b1b18; }
.ad-service h1,.ad-service h2 { margin:0; font-weight:800; line-height:1.03; letter-spacing:0; }
.ad-service h2 { font-size:60px; }
.ad-service h2 em { font-weight:500; font-style:normal; color:#665f56; }
.ad-hero { position:relative; isolation:isolate; overflow:clip; color:#f9f4eb; background:#252220; }
.ad-hero-art { position:absolute; inset:0; z-index:-2; }
.ad-hero-art img { height:100%; object-position:62% 44%; }
.ad-hero::after { position:absolute; inset:0; z-index:-1; content:""; background:linear-gradient(0deg,#151515f8 0%,#181716d9 26%,#1a19173d 64%,#1b18171a),linear-gradient(90deg,#211c18ad,transparent 74%); }
.ad-hero-inner { min-height:min(680px,76svh); padding-block:30px 62px; display:grid; grid-template: auto 1fr / minmax(0,1.5fr) minmax(0,.7fr); gap:24px 48px; align-items:end; }
.ad-hero .exp-back { grid-column:1/-1; justify-self:start; margin:0; color:#fff9f0; }
.ad-hero .exp-kicker,.ad-showcase .exp-kicker { color:#edb095; }
.ad-hero h1 { max-width:13ch; font-size:76px; overflow-wrap:anywhere; }
.ad-hero-side { max-width:36ch; font-size:16px; }
.ad-hero-side p { margin:0 0 16px; }
.ad-hero-side a { display:inline-flex; gap:12px; padding-bottom:6px; border-bottom:1px solid #d58e71; color:#fff8ef; text-decoration:none; }
.ad-hero-side a span { color:#edb095; }
.ad-challenge { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.82fr); gap:44px; align-items:end; padding-block:105px; }
.ad-challenge article p { margin:0; font-size:17px; }
.ad-showcase {
  --ad-track-height:320svh;
  color:#f7f3eb; overflow:clip; background:#202120;
}
.ad-showcase [hidden] { display:none; }
.ad-stage { min-width:0; padding-block:80px 88px; }
.ad-showcase-heading { margin-bottom:24px; }
.ad-showcase-heading .exp-kicker { margin-bottom:10px; }
.ad-showcase .ad-showcase-heading h2 { font-size:50px; }
.ad-reel { position:relative; isolation:isolate; width:min(100%,880px); height:323px; margin-inline:auto; }
.ad-request {
  box-sizing:border-box; position:relative; z-index:2; width:min(88%,635px); min-height:88px;
  padding:13px 21px; border:1px solid #806b59; border-left:3px solid #c88f71; border-radius:5px;
  background:#2c2925; box-shadow:0 11px 28px #120f0d72; transform:translateY(var(--ad-question-y,0px));
  opacity:var(--ad-question-light,1);
}
.ad-followup { position:absolute; inset:0 auto auto 0; opacity:var(--ad-followup-light,0); transform:translateY(var(--ad-followup-y,0px)); }
.ad-role { margin:0 0 5px; color:#e9bc9e; font:650 11px/1.35 ui-monospace,Consolas,monospace; text-transform:uppercase; }
.ad-role span { margin-inline-end:6px; }
.ad-question { margin:0; color:#fff5ea; font-size:23px; font-weight:750; line-height:1.2; }
.ad-fold { position:absolute; inset:111px 0 0 auto; width:min(89%,704px); }
.ad-fold > * { box-sizing:border-box; position:absolute; inset:0 0 auto; }
.ad-inputs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:0; padding:0; list-style:none;
  opacity:var(--ad-input-light,1);
}
.ad-input {
  box-sizing:border-box; display:grid; align-content:center; gap:5px; min-height:88px; min-width:0; padding:9px 12px;
  border:1px solid #ac8b74; border-radius:5px; color:#342920; background:linear-gradient(160deg,#eee5d6,#d6bea5);
  box-shadow:0 7px 20px #15110e88;
  transform:translate(var(--ad-input-x,0),var(--ad-input-y,0)) rotate(var(--ad-input-turn,0deg)) scale(var(--ad-input-scale,1));
}
.ad-input span { color:#71442f; font:650 10px/1.2 ui-monospace,Consolas,monospace; text-transform:uppercase; }
.ad-input strong { font-size:15px; line-height:1.25; overflow-wrap:anywhere; }
.ad-workflow {
  min-height:118px; padding:14px 18px 16px; border:1px solid #8a7867; border-radius:5px; background:#282e2c;
  opacity:var(--ad-workflow-light,0); transform:translateY(var(--ad-workflow-y,0px)) scaleX(var(--ad-workflow-scale,1));
  box-shadow:0 15px 28px #0e0f0db5;
}
.ad-workflow-message { margin:0; color:#f5f1e6; font-size:20px; font-weight:750; line-height:1.2; }
.ad-steps { position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 0; padding:9px 0 0; border-top:1px solid #a5947f55; list-style:none; }
.ad-steps::before { content:""; position:absolute; inset:-1px 0 auto; height:1px; background:#dfa280; transform:scaleX(var(--ad-route,0)); transform-origin:left; }
.ad-steps li { display:flex; align-items:center; gap:5px; min-width:0; color:#eddfce; font-size:12px; line-height:1.25; overflow-wrap:anywhere; opacity:var(--ad-step-light,.42); }
.ad-steps svg { flex:none; width:15px; height:15px; color:#bee1c9; }
.ad-answer {
  min-height:145px; padding:16px 22px 18px; border:1px solid #c6a386; border-left:3px solid #a95e40; border-radius:5px;
  background:linear-gradient(150deg,#fff7e9,#e9dfce); color:#241f19; box-shadow:0 17px 42px #100d0ba8;
  opacity:var(--ad-answer-light,0); transform:translateY(var(--ad-answer-y,0px));
  clip-path:inset(0 0 var(--ad-answer-mask,100%) 0);
}
.ad-answer .ad-role { color:#754934; }
.ad-confirmed {
  background:linear-gradient(150deg,#f4f5eb,#dbe4d8); border-color:#a0ac98; border-left-color:#547560;
  opacity:var(--ad-confirm-light,0); transform:translateY(var(--ad-confirm-y,0px));
  clip-path:inset(0 0 var(--ad-confirm-mask,100%) 0);
}
.ad-confirmed .ad-role { color:#3e5c48; }
.ad-answer h3 { margin:0 0 5px; font-size:29px; line-height:1.1; }
.ad-address-status,.ad-address-steps { margin:0; font-size:15px; line-height:1.38; }
.ad-address-steps { display:grid; gap:3px; margin-top:7px; padding-inline-start:22px; }
.ad-address-steps li::marker { font-weight:750; }
.ad-beats,.ad-rail,.ad-static { list-style:none; padding:0; margin:0; }
.ad-beats { display:grid; width:min(100%,1040px); margin:12px auto 8px; }
.ad-beat { grid-area:1/1; min-width:0; opacity:var(--ad-caption-light,0); transform:translateY(var(--ad-caption-y,0px)); }
.ad-phase-name { margin:0 0 4px; color:#efbda3; font:650 11px/1.3 ui-monospace,Consolas,monospace; text-transform:uppercase; }
.ad-phase-name span { margin-inline-end:6px; }
.ad-beat h3,.ad-static h3 { margin:0 0 5px; font-size:27px; line-height:1.16; }
.ad-beat p:last-child,.ad-static p:last-child { margin:0; max-width:63ch; color:#e0d8cb; font-size:15px; line-height:1.4; }
.ad-rail { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); width:min(100%,1040px); margin-inline:auto; border-top:1px solid #807266; }
.ad-rail::before { content:""; position:absolute; inset:-1px 0 auto; height:1px; background:#f2b58d; transform:scaleX(var(--ad-scroll-progress,0)); transform-origin:left; }
.ad-rail li { padding:8px 3px 0 0; font-size:12px; color:#d0c2b6; overflow-wrap:anywhere; }
.ad-rail li[data-current] { color:#fff5e8; font-weight:750; }
.ad-static { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.ad-static > li { padding-top:15px; border-top:1px solid #8c7564; }
.ad-static :is(.ad-address-status,.ad-address-steps) { color:#e0d8cb; }
.ad-showcase[data-scroll] .ad-track { height:var(--ad-track-height); }
.ad-showcase[data-scroll] .ad-frame { position:sticky; top:0; min-height:0; height:100svh; display:grid; align-items:center; }
.ad-showcase[data-scroll] .ad-stage { padding-block:14px 18px; }
.ad-showcase[data-scroll] .ad-static {
  position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap;
}
/* Reserve the track before the module runs so browser scroll restoration sees the final page height. */
@media (scripting:enabled) and (min-height:600px) and (prefers-reduced-motion:no-preference) {
  .ad-showcase[data-scroll-capable] .ad-track { height:var(--ad-track-height); }
}
@media (max-width:700px) {
  .ad-stage { padding-block:50px; }
  .ad-showcase-heading { margin-bottom:15px; }
  .ad-showcase .ad-showcase-heading h2 { font-size:34px; }
  .ad-showcase { --ad-track-height:295svh; }
  .ad-reel { height:279px; }
  .ad-request { width:100%; min-height:79px; padding:9px 10px; }
  .ad-question { font-size:18px; }
  .ad-fold { top:101px; width:96%; }
  .ad-inputs { gap:4px; }
  .ad-input { padding:7px 5px; min-height:67px; gap:4px; }
  .ad-input span { font-size:9px; }
  .ad-input strong { font-size:12px; }
  .ad-workflow { padding:11px 9px; }
  .ad-workflow-message { font-size:17px; }
  .ad-steps { gap:4px; }
  .ad-steps li { gap:2px; font-size:11px; }
  .ad-steps svg { width:11px; height:11px; }
  .ad-answer { min-height:125px; padding:11px 11px 13px; }
  .ad-answer h3 { font-size:22px; }
  .ad-address-status,.ad-address-steps { font-size:13px; }
  .ad-beats { margin-block:13px 9px; }
  .ad-beat h3,.ad-static h3 { font-size:20px; }
  .ad-beat p:last-child,.ad-static p:last-child { font-size:13px; }
  .ad-rail li { font-size:11px; }
  .ad-static { grid-template-columns:1fr; gap:18px; }
}
@media (min-width:701px) and (max-height:690px) {
  .ad-showcase .ad-showcase-heading h2 { font-size:39px; }
  .ad-reel { height:280px; }
}
.ad-build { padding-block:100px; }
.ad-capabilities { margin-top:32px; border-bottom:1px solid #cfc8bb; }
.ad-capabilities details { border-top:1px solid #cfc8bb; }
.ad-capabilities summary { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:12px; align-items:center; padding-block:16px; cursor:pointer; font-size:23px; font-weight:750; }
.ad-capabilities summary::-webkit-details-marker { display:none; }
.ad-capabilities summary span,.ad-capabilities summary::after { color:#944d36; }
.ad-capabilities summary span { font-size:13px; }
.ad-capabilities summary::after { content:"+"; }
.ad-capabilities details[open] summary::after { content:"-"; }
.ad-capabilities details p { margin:0 0 20px 64px; max-width:55ch; color:#4e4a42; }
.ad-contact { background:#efe3d2; }
.ad-contact-inner { padding-block:86px; }
.ad-contact .ad-contact-cta { margin-top:22px; min-height:48px; background:#603622; color:#fff8ef; border-color:#603622; }
.ad-contact .ad-contact-cta:hover { background:#7a4b35; }
.ad-related { padding-block:60px; }
@media (max-width:1000px) {
  .ad-hero h1 { font-size:62px; }
  .ad-service h2 { font-size:48px; }
}
@media (max-width:700px) {
  .ad-hero-inner { grid-template:auto 1fr auto / 1fr; gap:15px; min-height:min(580px,76svh); padding-block:25px 37px; }
  .ad-hero h1 { font-size:46px; }
  .ad-hero-side { font-size:15px; }
  .ad-hero-side p { margin-bottom:8px; }
  .ad-service h2 { font-size:36px; }
  .ad-challenge { grid-template-columns:minmax(0,1fr); gap:20px; }
  .ad-challenge,.ad-build,.ad-contact-inner { padding-block:62px; }
  .ad-capabilities summary { grid-template-columns:27px minmax(0,1fr) auto; font-size:17px; gap:8px; }
  .ad-capabilities details p { margin-left:35px; }
}
@media (max-width:359px) {
  .ad-hero h1 { font-size:39px; }
  .ad-service h2 { font-size:32px; }
}