/* =====================================================================
   SOUNAB MITRA — DESIGN TOKENS (v1, 12 Oct 2026)
   Status key used in comments:
     APPROVED  = agreed brand decision
     DEFAULT   = implementation value derived from approved decisions
     PROPOSED  = new suggestion, NOT YET APPROVED (kept out of defaults
                 unless noted)
   Font paths are relative to this file inside the handoff package.
   On the live site, copy 01-BRAND-IDENTITY/fonts/ to /fonts/ and change
   the url() paths to /fonts/... .
   ===================================================================== */

/* ---------- Fonts (SIL OFL 1.1, self-hosted) ---------- */
@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('/fonts/bricolage-grotesque/bricolage-grotesque-latin-standard-normal.woff2') format('woff2-variations'),
       url('/fonts/bricolage-grotesque/bricolage-grotesque-latin-standard-normal.woff2') format('woff2');
  font-weight: 200 800;
  font-stretch: 75% 100%;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('/fonts/bricolage-grotesque/bricolage-grotesque-latin-ext-standard-normal.woff2') format('woff2-variations'),
       url('/fonts/bricolage-grotesque/bricolage-grotesque-latin-ext-standard-normal.woff2') format('woff2');
  font-weight: 200 800;
  font-stretch: 75% 100%;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Mono';
  src: url('/fonts/dm-mono/dm-mono-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Mono';
  src: url('/fonts/dm-mono/dm-mono-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---------- Brand colours (APPROVED) ---------- */
  --sm-white: #FFFFFF;
  --sm-sheet: #EDEDE9;
  --sm-ink:   #111111;
  --sm-grey:  #55554F;
  --sm-rani:  #D1105E;

  /* ---------- Semantic colours ---------- */
  --brand-primary:        var(--sm-ink);      /* APPROVED: the brand reads ink-first */
  --brand-secondary:      var(--sm-sheet);    /* APPROVED */
  --brand-accent:         var(--sm-rani);     /* APPROVED: <=3% of any screen */
  --background-primary:   var(--sm-white);    /* APPROVED */
  --background-secondary: var(--sm-sheet);    /* APPROVED */
  --surface-frame:        var(--sm-ink);      /* APPROVED: film frame */
  --text-primary:         var(--sm-ink);      /* APPROVED 18.88:1 on white */
  --text-secondary:       var(--sm-grey);     /* APPROVED 7.50:1 on white, 6.39:1 on sheet */
  --text-muted:           var(--sm-grey);     /* DEFAULT: no lighter readable grey exists */
  --text-on-frame:        #BDBDB6;            /* DEFAULT: frame numbers, 10.0:1 on ink */
  --text-disabled:        #8A8A85;            /* DEFAULT: disabled controls only */
  --text-on-accent:       var(--sm-white);    /* APPROVED 5.32:1 on rani */
  --accent-hover:         #A80D4B;            /* DEFAULT: rani -20%, white on it 7.44:1 */
  --border-primary:       var(--sm-ink);      /* APPROVED */
  --border-hairline:      #D6D6D0;            /* DEFAULT: decorative dividers only */
  --focus-ring:           var(--sm-ink);      /* DEFAULT */
  --state-error:          var(--sm-rani);     /* DEFAULT: always with icon + text */
  --state-success:        var(--sm-ink);      /* DEFAULT: with check icon */

  /* Cursor glow */
  --glow-primary:   209 16 94;     /* rani as RGB triplet (APPROVED colour) */
  --glow-secondary: 123 44 191;    /* #7B2CBF violet — PROPOSED, NOT YET APPROVED */

  /* ---------- Type ---------- */
  --font-display: 'Bricolage Grotesque', 'Arial Narrow', Arial, sans-serif;
  --font-body:    'Bricolage Grotesque', Arial, sans-serif;
  --font-mono:    'DM Mono', ui-monospace, Menlo, monospace;

  --h1-size: clamp(48px, 33.1px + 3.81vw, 88px);   /* APPROVED 88/80 desktop, 48/46 mobile */
  --h1-lh: 0.91;
  --h1-track: -0.025em;                            /* APPROVED; PROPOSED alternative -0.015em */
  --h1-vary: 'wdth' 75, 'opsz' 96;                 /* APPROVED; PROPOSED alternative wdth 78 */
  --h2-size: clamp(30px, 24.8px + 1.333vw, 44px);  /* APPROVED 44/46, 30/32 */
  --h2-lh: 1.05;
  --h3-size: clamp(20px, 19.3px + 0.19vw, 22px);   /* APPROVED 22/28, 20/26 */
  --h3l-size: clamp(24px, 21.8px + 0.57vw, 30px);  /* DEFAULT card/service titles */
  --body-size: clamp(16px, 15.6px + 0.1vw, 17px);  /* APPROVED 17/27, 16/26 */
  --body-lh: 1.6;
  --lead-size: clamp(17px, 16.3px + 0.19vw, 19px); /* DEFAULT */
  --label-size: 12px;                              /* APPROVED */
  --caption-size: 13px;                            /* APPROVED */

  /* ---------- Space (APPROVED scale) ---------- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 16px; --space-4: 24px;
  --space-5: 48px; --space-6: 72px; --space-7: 120px;
  --section-gap: 120px;                            /* DEFAULT */

  /* ---------- Grid ---------- */
  --grid-cols: 12;  --grid-margin: 96px; --grid-gutter: 24px;   /* APPROVED @1440 */
  --content-max: 1248px;

  /* ---------- Shape ---------- */
  --radius: 0;                                     /* APPROVED: everything square */
  --border-button: 1.5px;
  --header-h: 88px; --logo-h: 30px;

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-hover: 160ms; --t-underline: 180ms; --t-lightbox: 200ms;
  --t-select: 400ms; --t-reveal: 300ms; --t-stagger: 150ms;
  --lift: 2px;                                     /* APPROVED frame lift */
}

@media (max-width: 1279px) { :root { --grid-margin: 48px; --grid-gutter: 20px; --section-gap: 104px; } }
@media (max-width: 1023px) { :root { --grid-cols: 8;  --grid-margin: 40px; --grid-gutter: 20px; --section-gap: 88px; } }
@media (max-width: 767px)  { :root { --grid-cols: 4;  --grid-margin: 20px; --grid-gutter: 16px; --section-gap: 72px; --header-h: 64px; --logo-h: 22px; } }

/* ---------- Type utilities ---------- */
.t-h1 { font: 780 var(--h1-size)/var(--h1-lh) var(--font-display); font-variation-settings: var(--h1-vary); letter-spacing: var(--h1-track); }
.t-h2 { font: 740 var(--h2-size)/var(--h2-lh) var(--font-display); font-variation-settings: 'wdth' 80, 'opsz' 48; letter-spacing: -0.015em; }
.t-h3 { font: 650 var(--h3-size)/1.27 var(--font-display); font-variation-settings: 'wdth' 80, 'opsz' 24; letter-spacing: -0.01em; }
.t-h3l { font: 740 var(--h3l-size)/1.04 var(--font-display); font-variation-settings: 'wdth' 80, 'opsz' 32; letter-spacing: -0.01em; }
.t-body { font: 400 var(--body-size)/var(--body-lh) var(--font-body); font-variation-settings: 'opsz' 14; }
.t-lead { font: 400 var(--lead-size)/1.58 var(--font-body); font-variation-settings: 'opsz' 14; }
.t-label { font: 500 var(--label-size)/16px var(--font-mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-secondary); }
.t-caption { font: 400 var(--caption-size)/18px var(--font-body); color: var(--text-secondary); }
/* Reference build of the homepage. Layout and tokens follow 03-WEBSITE-SPECS/homepage.md.
   It is a visual/behavioural reference for the developer, not production code. */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--background-primary);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--background-primary);color:var(--text-primary);font:400 var(--body-size)/var(--body-lh) var(--font-body);font-variation-settings:'opsz' 14;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
p{margin:0}
.wrap{width:100%;max-width:calc(var(--content-max) + 2 * var(--grid-margin));margin:0 auto;padding:0 var(--grid-margin)}
.grid{display:grid;grid-template-columns:repeat(var(--grid-cols),minmax(0,1fr));column-gap:var(--grid-gutter)}
.label{font:500 12px/16px var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary)}
.label.ink{color:var(--text-primary)}
.ico{display:inline-block;width:1em;height:1em;vertical-align:-0.12em;flex:none}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--sm-ink);color:#fff;padding:10px 14px;font:500 13px/1 var(--font-mono);z-index:200}
.skip:focus{left:8px}

/* reference banner (not part of the design) */
.refbar{background:var(--sm-ink);color:#fff;font:500 11px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;padding:8px var(--grid-margin);text-align:center}

/* header */
.hdr{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:block;height:var(--logo-h)}
.logo svg{height:100%;width:auto}
.nav{display:flex;align-items:center;gap:34px}
.nav a{white-space:nowrap;font:500 13px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;position:relative;padding:6px 0}
.nav a.link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--t-underline) var(--ease)}
.nav a.link:hover::after,.nav a.link[aria-current="page"]::after{transform:scaleX(1)}
.btn-outline{border:var(--border-button) solid var(--border-primary);padding:11px 16px!important;transition:background var(--t-hover) var(--ease),color var(--t-hover) var(--ease)}
.btn-outline:hover{background:var(--sm-ink);color:#fff}
.menu-btn{display:none;font:500 13px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;background:none;border:var(--border-button) solid var(--border-primary);padding:11px 14px;color:var(--text-primary);cursor:pointer;min-height:44px}
.mobile-menu{position:fixed;inset:0;background:var(--background-primary);z-index:90;display:none;flex-direction:column;padding:0 var(--grid-margin) 28px}
.mobile-menu.open{display:flex}
.mobile-menu .top{height:var(--header-h);display:flex;align-items:center;justify-content:space-between}
.mobile-menu nav{display:flex;flex-direction:column;margin-top:32px;border-top:1px solid var(--sm-ink)}
.mobile-menu nav a{font:740 40px/1 var(--font-display);font-variation-settings:'wdth' 80,'opsz' 48;letter-spacing:-.015em;text-decoration:none;padding:18px 0;border-bottom:1px solid var(--border-hairline);display:flex;justify-content:space-between;align-items:baseline}
.mobile-menu nav a span{font:500 12px/1 var(--font-mono);color:var(--text-secondary);letter-spacing:.05em}
.mobile-menu .btn-solid{margin-top:auto;justify-content:center}

/* hero */
.hero{padding-top:96px;align-items:end}
.hero .main{grid-column:1/10}
.hero .side{grid-column:10/13;padding-bottom:8px}
.hero h1{margin:26px 0 0}
.hero .lead{font:400 var(--lead-size)/1.58 var(--font-body);font-variation-settings:'opsz' 14}
.sel{position:relative;display:inline-block}
.sel svg{max-width:none;position:absolute;left:-0.27em;top:-0.1em;width:calc(100% + 0.5em);height:calc(100% + 0.22em);overflow:visible;pointer-events:none}
.sel path{stroke-dasharray:1;stroke-dashoffset:0}
.js .sel path{animation:draw var(--t-select) var(--ease) 300ms both}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}

/* selected work */
.sec-head{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding-bottom:18px}
.work{padding-top:var(--section-gap)}
.sheet{background:var(--background-secondary);padding:34px 36px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.card{display:block;text-decoration:none;color:inherit}
.card .title{font:740 var(--h3l-size)/1.04 var(--font-display);font-variation-settings:'wdth' 80,'opsz' 32;letter-spacing:-.01em;margin:8px 0 6px}
.card .row{display:flex;justify-content:space-between;gap:12px;margin-bottom:20px}
.card .see{color:var(--text-primary);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.card:hover .see{text-decoration-thickness:2px}
.frame{background:var(--surface-frame);padding:12px 12px 26px;position:relative;transition:transform var(--t-hover) var(--ease)}
.frame img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.frame .num{position:absolute;left:12px;right:12px;bottom:7px;display:flex;justify-content:space-between;font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--text-on-frame)}
.frame .num .m{display:inline-flex;gap:4px;align-items:center}
.frame .num .m svg{width:.7em;height:.7em}
.card:hover .frame,.card:focus-visible .frame{transform:translateY(calc(-1 * var(--lift)))}
.note{padding-top:16px;font:500 11px/1.5 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary)}

/* services */
.services{padding-top:var(--section-gap)}
.rule-head{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--sm-ink);padding-top:16px;margin-bottom:44px}
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
.svc h3{font:740 var(--h3l-size)/1.05 var(--font-display);font-variation-settings:'wdth' 80,'opsz' 32;margin:10px 0}
.svc p{color:var(--text-secondary);max-width:340px}
.svc .more{margin-top:44px}

/* about (PROPOSED section) */
.about{padding-top:var(--section-gap)}
.about .l{grid-column:1/4}
.about .r{grid-column:4/11}
.about .big{font:740 var(--h2-size)/1.08 var(--font-display);font-variation-settings:'wdth' 80,'opsz' 48;letter-spacing:-.015em}
.tlink{display:inline-flex;gap:8px;align-items:center;margin-top:24px;font:500 13px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.tlink:hover{text-decoration-thickness:2px}
.tlink:hover .ico{transform:translateX(3px)}
.tlink .ico{transition:transform var(--t-hover) var(--ease)}

/* CTA */
.cta{padding-top:var(--section-gap);padding-bottom:110px}
.cta .panel{background:var(--background-secondary);padding:72px 64px;display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
.cta .big{font:780 clamp(40px,30px + 2.4vw,64px)/.95 var(--font-display);font-variation-settings:'wdth' 75,'opsz' 96;letter-spacing:-.015em;margin-top:18px}
.btn-solid{display:inline-flex;gap:10px;align-items:center;background:var(--brand-accent);color:var(--text-on-accent);font:500 14px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;padding:18px 24px;text-decoration:none;min-height:52px;transition:background var(--t-hover) var(--ease)}
.btn-solid:hover{background:var(--accent-hover)}
.btn-solid:hover .ico{transform:translateX(3px)}
.btn-solid .ico{transition:transform var(--t-hover) var(--ease)}
.btn-solid:active{transform:translateY(1px)}

/* footer */
footer{padding-bottom:56px;display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
footer .flogo{height:44px}
footer .flogo svg{height:100%;width:auto}
footer .meta{text-align:right;font:500 12px/1.9 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary)}
footer .meta a{text-decoration:none}
footer .meta a:hover{color:var(--text-primary);text-decoration:underline;text-underline-offset:4px}

/* reveal (only when JS runs and motion is allowed) */
.js .rv{opacity:0;transform:translateY(12px);transition:opacity var(--t-reveal) var(--ease),transform var(--t-reveal) var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ---------- 1024 ---------- */
@media (max-width:1279px){
  .hero .main{grid-column:1/13}
  .hero .side{grid-column:1/8;padding-top:32px}
  .sheet{padding:28px;gap:24px}
  .about .l{grid-column:1/13;margin-bottom:16px}
  .about .r{grid-column:1/11}
}
/* ---------- 768 ---------- */
@media (max-width:1023px){
  .nav{gap:22px}
  .hero{padding-top:72px}
  .hero .main,.hero .side{grid-column:1/-1}
  .hero .side{max-width:520px}
  .sheet{grid-template-columns:1fr;padding:28px;gap:0}
  .card{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:20px;align-items:end;padding:28px 0;border-top:1px solid var(--border-hairline)}
  .card:first-child{border-top:0;padding-top:0}
  .card:last-child{padding-bottom:0}
  .card .meta{grid-column:5/9;grid-row:1;padding-bottom:6px}
  .card .frame{grid-column:1/5;grid-row:1}
  .card .row{flex-direction:column;gap:10px;margin:0}
  .svc{grid-template-columns:1fr;gap:0}
  .svc>div{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:20px;padding:24px 0;border-top:1px solid var(--border-hairline)}
  .svc>div:first-child{border-top:0;padding-top:0}
  .svc .n{grid-column:1/2}
  .svc .b{grid-column:2/9}
  .svc h3{margin-top:0}
  .about .r{grid-column:1/-1}
  .cta .panel{flex-direction:column;align-items:flex-start;padding:56px 40px}
}
/* ---------- 390 ---------- */
@media (max-width:767px){
  .refbar{font-size:10px}
  .nav{display:none}
  .menu-btn{display:inline-flex;align-items:center}
  .hero{padding-top:48px}
  .hero h1{margin-top:20px}
  .sec-head{flex-direction:column;gap:6px}
  .sheet{padding:20px 16px;margin:0 calc(-1 * var(--grid-margin) + 0px)}
  .card{display:block;padding:28px 0}
  .card .row{flex-direction:row;margin-bottom:16px}
  .frame{padding:10px 10px 24px}
  .frame .num{left:10px;right:10px;bottom:6px;font-size:11px}
  .svc>div{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:16px}
  .svc .n{grid-column:1/-1;margin-bottom:6px}
  .svc .b{grid-column:1/-1}
  .cta .panel{padding:44px 20px;margin:0 calc(-1 * var(--grid-margin))}
  .btn-solid{width:100%;justify-content:center}
  footer{flex-direction:column;align-items:flex-start}
  footer .flogo{height:30px}
  footer .meta{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  .js .rv{opacity:1;transform:none}
}
/* Extensions to Claude's supplied homepage reference. Brand values remain in tokens.css. */
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button.btn-solid{border:0}button.btn-outline,.btn-outline{font:500 13px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;min-height:44px;background:transparent;color:var(--sm-ink);cursor:pointer}button.btn-outline:hover{background:var(--sm-ink);color:var(--sm-white)}
.header-shell{position:sticky;top:0;background:var(--sm-white);z-index:50;border-bottom:1px solid transparent}.header-shell.scrolled{border-color:var(--border-hairline)}
.logo img,.flogo img{height:100%;width:auto;max-width:none}.logo{background:var(--sm-white)}footer .flogo{background:transparent}footer .flogo svg{display:block;overflow:visible}.nav a.link{display:flex;align-items:center;min-height:44px}.nav a.link::after{bottom:6px}.nav .btn-outline{display:flex;align-items:center;min-height:44px}.sec-head h2{margin:0}.ico.left{transform:rotate(180deg)}
.frame{display:block;border:0;border-radius:0;color:var(--text-on-frame);width:100%;text-align:left}.frame img{height:auto;aspect-ratio:auto;object-fit:contain;background:var(--sm-sheet)}.frame picture{display:block}.frame video{display:block;width:100%;height:auto;background:var(--sm-ink)}
.availability-badge{display:inline-flex;align-items:center;gap:8px;min-height:32px;margin-top:24px;padding:7px 10px;border:1px solid var(--sm-ink);border-radius:999px;color:var(--sm-ink);font:500 10px/1.2 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;text-decoration:none;transition:border-color var(--t-hover) var(--ease),background var(--t-hover) var(--ease),color var(--t-hover) var(--ease)}.availability-dot{position:relative;width:9px;height:9px;border-radius:50%;background:#2F8D55}.availability-dot::after{content:"";position:absolute;inset:0;border:1px solid rgba(47,141,85,.45);border-radius:inherit;animation:availability-pulse 2s ease-out infinite;will-change:transform,opacity}.availability-text{display:grid;inline-size:12ch;overflow:hidden;height:1.2em;white-space:nowrap}.availability-text span{grid-area:1/1;transition:transform var(--t-hover) var(--ease),opacity var(--t-hover) var(--ease)}.availability-text span:last-child{opacity:0;transform:translateY(100%)}@keyframes availability-pulse{0%,100%{opacity:.35;transform:scale(1)}45%{opacity:0;transform:scale(1.9)}}@media(hover:hover){.availability-badge:hover{background:var(--sm-ink);border-color:var(--sm-ink);color:var(--sm-white)}.availability-badge:hover .availability-text span:first-child{opacity:0;transform:translateY(-100%)}.availability-badge:hover .availability-text span:last-child{opacity:1;transform:translateY(0)}}.availability-badge:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;background:var(--sm-ink);color:var(--sm-white)}.availability-badge:focus-visible .availability-text span:first-child{opacity:0;transform:translateY(-100%)}.availability-badge:focus-visible .availability-text span:last-child{opacity:1;transform:translateY(0)}
.hero-meta{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:18px;row-gap:6px}.hero-meta-title{color:#55554F}.hero-meta-cta{color:#111111;text-decoration:none;white-space:nowrap;transition:color var(--t-hover) var(--ease)}.hero-meta-cta:hover,.hero-meta-cta:focus-visible{color:#D1105E}.footer-location{display:block;text-transform:none}
.svc.home-service-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:0;border:1px solid var(--sm-ink);background:var(--sm-white)}
.home-service-cell{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:200px;padding:30px 32px;background:var(--sm-white);color:var(--sm-ink);text-decoration:none;transition:background var(--t-hover) var(--ease)}
.home-service-cell:nth-child(odd){border-right:1px solid var(--sm-ink)}.home-service-cell:nth-child(-n+2){border-bottom:1px solid var(--sm-ink)}
.home-service-cell:hover{background:var(--sm-sheet)}.home-service-cell:focus-visible{outline:2px solid var(--sm-ink);outline-offset:-4px;background:var(--sm-sheet)}
@media(max-width:767px){.svc.home-service-grid{grid-template-columns:1fr;grid-auto-rows:auto}.home-service-cell{min-height:0;padding:24px}.home-service-cell:nth-child(odd){border-right:0}.home-service-cell:not(:last-child){border-bottom:1px solid var(--sm-ink)}}
.frame.small{padding:7px 7px 19px}.frame.small .num{font-size:9.5px;left:7px;right:7px;bottom:3px}.frame .select-box{position:absolute;inset:-5px;width:calc(100% + 10px);height:calc(100% + 10px);max-width:none;pointer-events:none}.play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:var(--sm-ink);color:white;padding:12px}.play svg{width:100%;height:100%}
.tag{display:inline-block;border:1.5px solid var(--sm-ink);padding:5px 9px;font:500 11px/1.4 var(--font-mono);text-transform:uppercase;letter-spacing:.06em;margin:6px 6px 0 0}.tags{margin:24px 0}.draft-note{border-left:2px solid var(--sm-ink);padding:8px 0 8px 16px;font:400 13px/1.6 var(--font-mono);color:var(--text-secondary);margin:24px 0;max-width:68ch}.measure{max-width:68ch}.page-intro{padding-top:96px;padding-bottom:72px}.page-intro h1{max-width:1050px;margin:24px 0 32px}.intro-lead{max-width:700px}.page-end{height:var(--section-gap)}
.slate{border:1px solid var(--sm-ink);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:24px 0 0}.slate>div{padding:12px 14px;border-bottom:1px solid var(--sm-ink)}.slate>div:not(.wide):nth-child(odd){border-right:1px solid var(--sm-ink)}.slate>div:last-child{border-bottom:0}.slate .wide{grid-column:1/-1}.slate dt{font:500 11px/1.4 var(--font-mono);text-transform:uppercase;color:var(--text-secondary);margin-bottom:5px}.slate dd{margin:0;font-size:15px;line-height:1.5}
.rolls{display:grid;gap:72px}.roll{display:grid;grid-template-columns: minmax(240px,3fr) minmax(0,9fr);gap:32px;padding:36px;background:var(--sm-sheet);text-decoration:none}.roll h2{font-size:clamp(28px,2.6vw,38px);margin:12px 0 18px}.roll .slate{display:block}.roll .slate>div{border-right:0!important}.roll-strip{display:flex;align-items:end;gap:12px;min-width:0;overflow-x:auto;padding:8px 0;scroll-snap-type:x mandatory}.roll-strip .frame{flex:none;scroll-snap-align:start;width:115px}.roll-strip .strip-lead{width:260px}.roll-strip .num{font-size:9px;left:7px;right:7px}.roll-strip .strip-small{padding:7px 7px 19px}.roll-strip .strip-small .num{bottom:4px}.swipe{display:none}.roll .tlink{line-height:1.5}
.case-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:40px}.case-top a{min-height:44px;display:inline-flex;gap:8px;align-items:center;text-decoration:none}.case-top>span:last-child{display:flex;gap:24px}.case-opening{display:grid;grid-template-columns:5fr 1fr 6fr;align-items:start;padding-top:48px;gap:24px}.case-opening h1{margin:20px 0 28px}.case-opening>div:first-child{grid-column:1}.case-hero{grid-column:3;width:min(100%,464px);justify-self:end;margin:5px}.case-opening .t-lead{font-size:18px}.peek{margin-top:48px;border-top:1px solid var(--border-hairline);padding-top:16px}.peek>a{text-decoration:none;display:inline-flex;min-height:44px;align-items:center}.peek-strip{display:flex;gap:12px;overflow-x:auto;padding:8px 0}.peek-strip>a{flex:0 0 104px;text-decoration:none}.peek-strip .num{font-size:8px}.peek-strip .m svg{display:none}.honesty-block{padding-top:var(--section-gap)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:48px}ul{padding-left:20px}li{padding-left:4px;margin-bottom:10px}li::marker{content:'— '}.honesty-block h2{margin:0 0 32px}
.campaign-sheet{padding-top:var(--section-gap);scroll-margin-top:110px}.campaign-sheet h2{margin:12px 0 24px}.sheet-intro{display:flex;justify-content:space-between;gap:32px;align-items:end;padding-bottom:36px}.sheet-intro p{max-width:530px;color:var(--text-secondary)}.sheet-intro .label{max-width:220px;text-align:right}.act{display:grid;grid-template-columns:3fr 9fr;gap:24px;padding:26px 0;border-top:1px solid var(--border-hairline)}.act-label{padding-right:20px}.act-label h3{margin:10px 0}.act-label p{font-size:14px;line-height:1.5;margin-bottom:14px;color:var(--text-secondary)}.act-frames{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start}.act-frames.compact{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.act-frames li{padding:0;margin:0;min-width:0}.act-frames li::marker{content:none}figure{margin:0}figcaption{font:500 10px/1.5 var(--font-mono);letter-spacing:.025em;text-transform:uppercase;color:var(--text-secondary);margin-top:8px}.act-frames figcaption{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.small .m svg{display:none}
.reading-section{margin-top:var(--section-gap)}.reading-section h2{margin:12px 0 32px}.reading-body{max-width:68ch;display:grid;gap:32px}.reading-body h3{margin:0 0 12px}.reading-body p{color:var(--text-secondary);white-space:pre-line}.system-panel{background:var(--sm-sheet);padding:48px}.system-panel .reading-body{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}.video-grid{display:flex;gap:32px;flex-wrap:wrap}.video-grid>figure{max-width:360px;flex:1 1 240px}.next-roll{margin-top:var(--section-gap);background:var(--sm-sheet);padding:48px;display:grid;grid-template-columns:1fr 300px;align-items:center;gap:48px}.next-roll h2{max-width:550px}.prose h2{margin-top:48px}.prose p{color:var(--text-secondary)}
.service-row{display:grid;grid-template-columns:2fr 5fr 5fr;gap:32px;border-top:1px solid var(--sm-ink);padding:48px 0}.service-row h2{margin:0 0 24px}.service-row h3{margin:0}.service-thumb{width:120px;margin-top:24px}.service-row p,.service-row li{color:var(--text-secondary)}.service-row .tlink{line-height:1.5}.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px}.process-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.process-grid p{color:var(--text-secondary)}
.contact-layout{display:grid;grid-template-columns:5fr 1fr 6fr;gap:24px}.contact-layout>div{grid-column:1}.contact-form{grid-column:3;background:var(--sm-sheet);padding:40px;scroll-margin-top:110px}.contact-form .draft-note{margin:0 0 30px}.contact-details{margin-top:48px}.contact-details h2{margin:32px 0 12px}.email-link{font-size:clamp(18px,1.8vw,25px);overflow-wrap:anywhere}.copy-email{display:block;margin-top:16px}#copy-status{font-size:14px}.field{margin:0 0 24px;padding:0;border:0;min-width:0}.field>label,.field legend{font:500 12px/1.5 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:10px}.field input:not([type=radio]),.field textarea,.field select{width:100%;min-height:52px;padding:14px 16px;border:1.5px solid var(--sm-ink);border-radius:0;background:white;font:400 17px/1.5 var(--font-body)}.field textarea{resize:vertical}.field input::placeholder,.field textarea::placeholder{color:var(--text-secondary);opacity:1}.chips{display:flex;flex-wrap:wrap;gap:10px}.chips label{position:relative;cursor:pointer}.chips input{position:absolute;width:1px;height:1px;opacity:0;left:10px;top:20px}.chips span{display:flex;align-items:center;min-height:44px;border:1.5px solid var(--sm-ink);padding:12px 14px;font:500 12px/1.4 var(--font-mono);text-transform:uppercase}.chips input:checked+span{background:var(--sm-ink);color:white}.chips input:focus-visible+span{outline:2px solid var(--sm-ink);outline-offset:3px}.error{color:var(--state-error);font-size:14px;margin-top:6px}.error:empty{display:none}[aria-invalid=true]{border-color:var(--state-error)!important}#form-errors{border:1.5px solid var(--state-error);padding:16px;margin-bottom:24px;color:var(--state-error)}.consent{margin:16px 0}.honeypot,.honeypot-control{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-form[aria-busy=true] .btn-solid{cursor:wait}.contact-form .btn-solid:disabled{opacity:.62;cursor:not-allowed}#form-result:not(:empty){border-top:1px solid var(--sm-ink);padding-top:24px;margin-top:24px}#form-result h2{margin:0 0 10px}#form-result p{margin:0;color:var(--text-secondary)}#form-result[data-state=error]{color:var(--state-error)}
.mobile-menu{border:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;color:var(--sm-ink)}.mobile-menu[open]{display:flex}.mobile-menu::backdrop,.inspect::backdrop{background:white}.inspect{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;margin:0;padding:28px 48px;background:white;color:var(--sm-ink);z-index:100;overflow:auto}.inspect[open]{display:flex;flex-direction:column;animation:inspect-in 200ms var(--ease)}@keyframes inspect-in{from{opacity:0}to{opacity:1}}.inspect-top{display:flex;justify-content:space-between;gap:24px;align-items:center}.inspect-top>div{display:flex;align-items:center;gap:24px}.inspect-body{display:grid;grid-template-columns:420px minmax(0,1fr);gap:48px;align-items:center;max-width:1152px;width:100%;margin:32px auto;flex:1}.inspect-copy h2{margin:18px 0 24px}.inspect-copy #inspect-description{margin-top:20px;color:var(--text-secondary)}.inspect-nav{display:flex;gap:12px;margin-top:30px}.inspect-nav button{display:inline-flex;align-items:center;gap:8px}.inspect-art{justify-self:center;max-width:456px;width:auto}.inspect-art .frame{width:fit-content;max-width:100%}.inspect-art img,.inspect-art video{width:auto;max-width:100%;max-height:calc(100dvh - 270px);height:auto;object-fit:contain}.filmstrip{display:flex;gap:8px;overflow-x:auto;margin:auto auto 0;padding:10px 4px;max-width:100%;flex-shrink:0}.filmstrip button{width:48px;flex:0 0 48px;padding:2px;background:white;border:1px solid transparent;opacity:.55}.filmstrip button[aria-current=true]{border-color:var(--sm-ink);opacity:1}.filmstrip img{width:100%;height:54px;object-fit:contain}.filmstrip span{font:500 9px var(--font-mono)}
@media(hover:hover){button.frame:hover{transform:translateY(-2px)}.roll:hover .strip-lead{transform:translateY(-2px)}.roll:hover .tlink{text-decoration-thickness:2px}}
@media(min-width:768px) and (max-width:900px){.nav{gap:14px}.nav .btn-outline{padding-left:10px!important;padding-right:10px!important}.hdr{gap:12px}}
@media(max-width:1279px){.roll{grid-template-columns:4fr 8fr;padding:28px;gap:24px}.roll-strip .strip-small:last-child{display:none}.case-opening{grid-template-columns:1fr 1fr}.case-opening>div:first-child{grid-column:1}.case-hero{grid-column:2;max-width:384px}.act-frames{grid-template-columns:repeat(3,minmax(0,1fr))}.act-frames.compact{grid-template-columns:repeat(5,minmax(0,1fr))}.contact-layout{grid-template-columns:5fr 7fr}.contact-form{grid-column:2}.inspect-body{grid-template-columns: minmax(260px,420px) minmax(0,1fr)}}
@media(max-width:1023px){.page-intro{padding-top:72px}.roll{grid-template-columns:1fr}.roll-info .slate{display:grid}.roll-info .slate>div{border-right:0}.roll-strip{gap:16px}.roll-strip .frame{width:45%;display:block!important}.swipe{display:block}.case-opening{grid-template-columns:1fr}.case-opening>div:first-child,.case-hero{grid-column:1}.case-hero{max-width:none;width:70%;justify-self:center;margin-top:32px}.act{grid-template-columns:1fr}.act-frames.compact{grid-template-columns:repeat(4,minmax(0,1fr))}.act-label p{max-width:450px}.sheet-intro{align-items:start}.service-row{grid-template-columns:1fr}.service-row>div:first-child{display:flex;align-items:start;gap:24px}.service-thumb{margin-top:0}.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.system-panel .reading-body{grid-template-columns:1fr}.contact-layout{grid-template-columns:1fr}.contact-layout>div,.contact-form{grid-column:1}.contact-form{margin-top:40px}.inspect{padding:20px 32px}.inspect-body{display:flex;flex-direction:column;gap:28px;margin-top:24px}.inspect-art{order:-1}.inspect-art img,.inspect-art video{max-height:55dvh;max-width:80vw}.inspect-copy{max-width:560px;width:100%}.inspect-nav{margin-bottom:16px}.filmstrip{min-height:90px}.next-roll{grid-template-columns:1fr 230px;padding:32px;gap:32px}}
@media(max-width:767px){.refbar{font-size:9px}.page-intro{padding-top:48px;padding-bottom:48px}.page-intro h1{margin-top:20px}.roll{margin:0 calc(-1 * var(--grid-margin));padding:24px 20px;gap:24px}.roll-info .slate{display:block}.roll-strip .frame{width:78%}.roll-strip .strip-small{padding:10px 10px 24px}.slate{grid-template-columns:1fr}.slate>div{border-right:0!important}.slate .wide{grid-column:1}.case-top{padding-top:24px;flex-wrap:wrap;gap:8px}.case-top>span:last-child{gap:16px}.case-opening{padding-top:32px}.case-hero{width:calc(100% - 10px);margin:28px 5px 5px}.case-opening h1{font-size:var(--h1-size)}.peek-strip>a{flex-basis:90px}.two-col{grid-template-columns:1fr;gap:24px}.sheet-intro{flex-direction:column;gap:16px}.sheet-intro .label{text-align:left;max-width:none}.act-frames,.act-frames.compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}.frame.small{padding:6px 6px 18px}.frame.small .num{font-size:9px;left:6px;right:6px}.act-frames figcaption{font-size:9px}.system-panel{padding:32px 20px;margin-left:calc(-1 * var(--grid-margin));margin-right:calc(-1 * var(--grid-margin))}.next-roll{grid-template-columns:1fr;padding:32px 20px;gap:24px;margin-left:calc(-1 * var(--grid-margin));margin-right:calc(-1 * var(--grid-margin))}.next-roll>a{max-width:280px}.service-thumb{display:none}.process-grid,.process-grid.three{grid-template-columns:1fr}.service-row{padding:32px 0;gap:16px}.contact-form{padding:28px 20px;margin-left:calc(-1 * var(--grid-margin));margin-right:calc(-1 * var(--grid-margin))}.contact-form .btn-solid{width:100%}.inspect{padding:16px 20px}.inspect-top{gap:12px;align-items:start}.inspect-top>.label{max-width:170px;font-size:10px}.inspect-top>div{gap:8px;flex-wrap:wrap;justify-content:end}.inspect-top>div .label{font-size:10px}.inspect-art img,.inspect-art video{max-width:calc(100vw - 74px);max-height:56dvh}.inspect-copy h2{font-size:30px}.inspect-nav{gap:8px}.inspect-nav button{font-size:11px}.rule-head{flex-wrap:wrap}.cta .big{margin-bottom:0}.video-grid{display:grid;grid-template-columns:1fr}.video-grid>figure{max-width:100%}footer .meta{overflow-wrap:anywhere}.mobile-menu nav{margin-top:16px}.mobile-menu .btn-solid{flex-shrink:0;margin-top:24px}.mobile-menu{overflow:auto}.mobile-menu .top{flex-shrink:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.frame{transform:none!important}.rv{opacity:1!important;transform:none!important}}
/* Match the mobile menu reference: the project action rests at the foot of the menu. */
@media(max-width:767px){.mobile-menu .btn-solid{margin-top:auto}.mobile-menu nav{margin-bottom:24px}}
/* Preserve poster height alongside 4:5 work-strip thumbnails. */
@media(min-width:1024px){.roll-strip .frame:has(.play){width:85px}.roll-strip .frame:has(.play) .play{width:36px;height:36px;padding:9px}}

/* Approved copy motion: the measure keeps the final headline word from reflowing. */
.rotating-word{position:relative;display:inline-grid;vertical-align:baseline;white-space:nowrap;color:var(--sm-ink);font:inherit;letter-spacing:inherit;text-align:left;padding:0;margin:0;border:0;background:none;appearance:none}
.rotating-word:focus-visible{outline:2px solid var(--sm-ink);outline-offset:4px}
.rotating-word:disabled{opacity:1;cursor:inherit}
.about-intro .t-lead+.t-lead{margin-top:1em}
.about-heading-static{display:block}
.about-rotating-sentence{position:relative;display:block;width:max-content;max-width:100%;padding:0;margin:0;border:0;background:none;color:var(--sm-ink);font:inherit;font-variation-settings:inherit;letter-spacing:inherit;line-height:inherit;text-align:left;appearance:none}
.about-rotating-sentence:focus-visible{outline:2px solid var(--sm-ink);outline-offset:4px}
.about-rotating-sentence:disabled{opacity:1;cursor:inherit}
.about-rotating-measure{display:block;visibility:hidden}
.about-rotating-live{position:absolute;inset:0;display:block;color:inherit}
.about-experience>div{border-bottom:0}
.about-experience>div:not(:first-child){border-top:1px solid var(--sm-ink)}
.client-types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--sm-ink);background:var(--sm-white)}
.client-type{min-width:0;padding:24px 28px}
.client-type:nth-child(odd){border-right:1px solid var(--sm-ink)}
.client-type:nth-child(-n+2){border-bottom:1px solid var(--sm-ink)}
.client-type h3{font:740 var(--h3l-size)/1.05 var(--font-display);font-variation-settings:'wdth' 80,'opsz' 32;text-transform:uppercase;margin:12px 0 0}
.client-types-more{margin:32px 0 0;color:var(--text-secondary)}
.client-types-more .tlink{margin:0;text-transform:none;letter-spacing:normal;font:inherit}
.services-ai-copy p{margin-bottom:0}
.services-ai-copy p+p{margin-top:1em}
@media(max-width:767px){.client-types{grid-template-columns:1fr}.client-type{padding:20px}.client-type:nth-child(odd){border-right:0}.client-type:not(:last-child){border-bottom:1px solid var(--sm-ink)}.client-type:last-child{border-bottom:0}}
.rotating-word-measure,.rotating-word-live{grid-area:1/1}
.rotating-word-measure{visibility:hidden}
.rotating-word-live{position:absolute;inset:0 auto auto 0;white-space:nowrap;color:inherit}
.cta-question{display:block;width:31ch;max-width:100%;white-space:nowrap}
.cta-typed::after{content:none}
.cta[data-motion-ready] .cta-typed::after{content:"";display:inline-block;width:1px;height:.9em;margin-left:2px;background:currentColor;animation:question-caret 1s step-end infinite}
@keyframes question-caret{50%{opacity:0}}
.motion-static{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1024px){.cta .panel{align-items:center}}
@media(min-width:768px) and (max-width:1023px){.hero .sel path{stroke-width:4px}}
@media(max-width:767px){.hero .sel path{stroke-width:3px}}
footer .flogo{height:26px}
@media(min-width:768px) and (max-width:900px){.nav{gap:10px}.nav a.link{font-size:12px}}
@media(max-width:767px){footer .flogo{height:19px}}
@media(max-width:767px){.mobile-menu nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}}
@media(prefers-reduced-motion:reduce){.cta[data-motion-ready] .cta-typed::after{content:none}}

/* Professional case studies use the same ink, type, spacing and contact-sheet frames. */
.professional-opening .case-hero{width:min(100%,464px)}
.professional-films{padding-top:var(--section-gap);border-top:1px solid var(--border-hairline);margin-top:var(--section-gap)}
.professional-films h2{margin:12px 0 32px}
.pro-film-grid{display:block}
.pro-film{min-width:0;max-width:900px;margin-left:auto}
.pro-film:first-child{max-width:none;margin-left:0}
.sasoli-films .pro-film{width:100%;max-width:none;margin-left:0}
.pro-film+.pro-film{margin-top:56px}
.pro-film-head{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:14px}
.pro-film-head h3{margin:0}
.pro-player{width:100%;aspect-ratio:16/9;background:var(--sm-ink);border:12px solid var(--sm-ink)}
.pro-player iframe{display:block;width:100%;height:100%;border:0}
.pro-film figcaption{font:400 13px/1.5 var(--font-body);letter-spacing:normal;text-transform:none;max-width:68ch}
.professional-story{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-top:1px solid var(--border-hairline);padding-top:28px}
.professional-story h2{margin:12px 0 20px}
.professional-story p,.professional-credits p{color:var(--text-secondary)}
.professional-sheet{border-top:1px solid var(--border-hairline)}
.pro-assets{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 24px;margin:0;padding:0}
.pro-assets li{min-width:0;margin:0;padding:0}
.pro-assets li::marker{content:none}
.pro-assets li:first-child{grid-column:1/-1}
/* GO DESi review: original artwork, C3 frames, and a full-width uncropped collage. */
.go-desi-intro{max-width:760px}
.go-desi-intro h1{margin:20px 0 28px}
.go-desi-intro .t-lead{max-width:650px}
.go-desi-disclosure{font-size:14px;color:var(--text-secondary);max-width:68ch}
.go-desi-hero{margin:48px 0 0}
.go-desi-hero-media{border:12px solid var(--sm-ink);background:var(--sm-ink)}
.go-desi-hero-media picture,.go-desi-hero-media img{display:block;width:100%;height:auto}
.go-desi-rationale{max-width:760px}
.go-desi-rationale p,.go-desi-credits p{color:var(--text-secondary);max-width:68ch}
.go-desi-gallery-group{border-top:1px solid var(--border-hairline);padding-top:28px}
.go-desi-gallery-group+.go-desi-gallery-group{margin-top:56px}
.go-desi-gallery-group>.label{margin-bottom:28px}
.go-desi-ads li:first-child{grid-column:auto}
.go-desi-ads .frame img{display:block;width:100%;height:auto}
.go-desi-closing>figure{max-width:760px;margin:0 auto}
.go-desi-closing h3{margin:0 0 24px}
.go-desi-closing .frame img{display:block;width:100%;height:auto}
.go-desi-supporting-copy{max-width:760px;margin:20px auto 0;color:var(--text-secondary)}
.go-desi-film-card .frame{aspect-ratio:4/5;display:flex;align-items:center;justify-content:center}
.go-desi-film-card .frame picture{width:100%}
.go-desi-film-card .frame img{display:block;width:100%;height:auto}
.pro-assets .frame{cursor:zoom-in}
.pro-assets .frame img{display:block;width:100%;height:auto;object-fit:contain;aspect-ratio:auto}
.pro-assets figcaption{display:block;font-size:11px;margin-top:12px}
.pro-assets figcaption span{color:var(--sm-ink)}
.axon-gallery-group+.axon-gallery-group{margin-top:88px}
.axon-gallery-group>.t-h3{margin:12px 0 32px}
.axon-experience-assets li:first-child{grid-column:1/-1}
.professional-credits{display:grid;grid-template-columns:1fr 1fr;gap:48px;border-top:1px solid var(--border-hairline);padding-top:28px}
.professional-credits h2{margin:12px 0 20px}
.professional-credits p+p{margin-top:16px}
@media(max-width:1023px){.professional-story{grid-template-columns:1fr;gap:38px}.professional-opening .case-hero{width:min(70%,464px)}}
@media(max-width:767px){.professional-opening .case-hero{width:calc(100% - 10px)}.pro-film{max-width:100%}.pro-film+.pro-film{margin-top:48px}.pro-film-head{display:block}.pro-film-head h3{margin-top:8px}.pro-player{border-width:8px}.pro-assets{grid-template-columns:1fr;gap:38px}.pro-assets li:first-child{grid-column:1}.professional-credits{grid-template-columns:1fr;gap:32px}}
@media(max-width:767px){.go-desi-hero{margin-top:32px}.go-desi-hero-media{border-width:8px}.go-desi-gallery-group+.go-desi-gallery-group{margin-top:40px}.go-desi-ads{gap:30px}.go-desi-film-card .frame{aspect-ratio:4/5}}

/* Preserve the approved logo dimensions in desktop and mobile navigation. */
.hdr .logo,.mobile-menu .top .logo{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;height:auto;flex:none}
.hdr .logo img,.mobile-menu .top .logo img{height:var(--logo-h)}

/* The existing contact-sheet cards form one slow, continuous strip. */
.film-roll-head{align-items:center}
.film-roll-actions,.film-roll-controls{display:flex;align-items:center;gap:18px}
.film-roll-all{font:500 11px/1.3 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;text-underline-offset:4px;white-space:nowrap}
.film-roll-arrow{background:none;border:0;padding:8px;color:var(--sm-ink);font:500 20px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.05em;min-width:36px;min-height:36px}
.film-roll-arrow:hover{color:var(--sm-rani)}
.film-roll-viewport{display:block;overflow:hidden;padding:34px 36px;scroll-padding-inline:36px;overscroll-behavior-inline:contain}
.film-roll-viewport:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.film-roll-track,.film-roll-group{display:flex;width:max-content;align-items:stretch}
.film-roll-group{flex:none;gap:36px;padding-right:36px}
.film-roll-card{display:flex;flex-direction:column;flex:none;width:max(280px,calc((min(100vw - 2 * var(--grid-margin),var(--content-max)) - 144px)/3))}
.film-roll-card .meta{display:flex;flex-direction:column;min-height:145px}
.film-roll-card .row{margin-top:auto}
.film-roll-card .frame{margin-top:auto}
.film-roll-track.is-moving{will-change:transform}
.film-roll-duplicate{pointer-events:none}
.axon-spotlight{border-top:1px solid var(--border-hairline);padding-top:28px}
.axon-spotlight h2{margin:12px 0 20px}
.axon-spotlight>p{max-width:68ch;color:var(--text-secondary)}
.axon-spotlight-facts{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--sm-ink);margin:32px 0 0;max-width:800px}
.axon-spotlight-facts>div{padding:20px 24px}
.axon-spotlight-facts>div+div{border-left:1px solid var(--sm-ink)}
.axon-spotlight-facts dt{font:500 11px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:8px}
.axon-spotlight-facts dd{margin:0;font:500 17px/1.5 var(--font-body)}
@media(max-width:1023px){.film-roll-card{width:280px}.film-roll-group{gap:24px;padding-right:24px}.film-roll-viewport{padding:28px;scroll-padding-inline:28px}.film-roll-head{align-items:flex-start}.film-roll-actions{flex-wrap:wrap;justify-content:flex-end}.film-roll-group .film-roll-card{border-top:1px solid var(--border-hairline);padding:28px 0}}
@media(max-width:767px){
 .film-roll-head{display:block}
 .film-roll-actions{justify-content:space-between;gap:8px 16px;margin-top:10px}
 .film-roll-actions>.label{width:100%}
 .film-roll-controls{gap:4px}
 .film-roll-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--grid-margin);scrollbar-width:none;padding:20px var(--grid-margin);touch-action:pan-x pan-y}
 .film-roll-viewport::-webkit-scrollbar{display:none}
 .film-roll-group{gap:16px;padding-right:calc(var(--grid-margin) + 16px)}
 .film-roll-card{width:calc(100vw - 2 * var(--grid-margin) - 36px);scroll-snap-align:start}
 .film-roll-card .meta{min-height:154px}
 .film-roll-duplicate{display:none}
 .axon-spotlight-facts{grid-template-columns:1fr}
 .axon-spotlight-facts>div+div{border-left:0;border-top:1px solid var(--sm-ink)}
}
@media(prefers-reduced-motion:reduce){
 .film-roll-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
 .film-roll-viewport::-webkit-scrollbar{display:none}
 .film-roll-duplicate{display:none}
 .film-roll-card{scroll-snap-align:start}
}
