/* ENENINTA · Bathyal / Signal Coral · shared type roles.
   Zalando Sans Expanded supplies EN/DE display type.
   Commissioner supplies reading/UI text and Greek display type.
   The original studio wordmark retains its original, separate Syne styling. */
:root {
  --display: 'Zalando Sans Expanded', 'Commissioner', Arial, sans-serif;
  --display-weight: 800;
  --body: 'Commissioner', Arial, sans-serif;
  --mono: var(--body);
  --tech: 'Michroma', 'Commissioner', sans-serif;
  --type-hero: clamp(44px, 6.65vw, 100px);
  --type-h1: clamp(40px, 5.25vw, 80px);
  --type-h2: clamp(34px, 4.65vw, 72px);
  --type-h3: clamp(24px, 2.5vw, 36px);
  --type-card: clamp(21px, 2.25vw, 32px);
  --type-body: clamp(16px, 1.25vw, 18px);
  --type-small: 14px;
  --type-ui: 14px;
  --leading-display: 1.06;
  --leading-heading: 1.12;
  --leading-body: 1.6;
  --tracking-display: -.025em;
  --tracking-heading: -.018em;
}
html { font-synthesis: none; }
body {
  font-family: var(--body);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: var(--leading-body);
  font-variation-settings: normal;
}
button, input, select, textarea { font-family: var(--body); }
body :is(h1,h2,h3,.display,.h-display,.section-title,.service-tile__name,
  .work-card__project,.diptych__name,.dialog__title,.flow-title,
  .flow-step strong,.related-link strong,.archive-category,.archive-card__copy strong) {
  font-family: var(--display);
  font-weight: var(--display-weight);
  font-variation-settings: normal;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  text-wrap: balance;
}
body :is(h1,h2,h3):lang(el),
body :is(.display,.h-display,.section-title,.service-tile__name,.work-card__project,.diptych__name):lang(el) {
  font-family: var(--body);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -.01em;
}
body.studio-home .hero__title {
  font-size: var(--type-hero);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
  max-width: 13ch;
  text-wrap: initial;
}
body.studio-inner main .hero h1,
body.studio-inner main .hero:has(.hero__media) h1,
body.studio-inner main .hero-grid h1 {
  font-family: var(--display);
  font-size: var(--type-h1);
  font-weight: var(--display-weight);
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-display);
  overflow-wrap: normal;
  hyphens: auto;
}
body.studio-home :is(.section-title,.work-heading .section-title,.process-copy .section-title),
body.studio-inner :is(.intro h2,.section-head h2,.gallery-heading h2,.gallery-group h2,.flow-title) {
  font-size: var(--type-h2);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}
body.studio-inner .case-story h2 { font-size: clamp(30px, 3.2vw, 48px); }
body :is(.deliverable h3,.gallery-note h3) { font-size: var(--type-h3); }
body.studio-home .service-tile__name { font-size: var(--type-card); }
body.studio-home .work-player .work-card__project {
  font-family: var(--display);
  font-size: clamp(22px, 1.85vw, 28px);
  font-weight: var(--display-weight);
  letter-spacing: -.015em;
  line-height: 1.15;
}
body.studio-home .drawing-panel .diptych__name {
  font-size: clamp(32px, 4.2vw, 64px);
  font-weight: var(--display-weight);
  letter-spacing: -.025em;
  line-height: 1.08;
}
body.studio-home .process-panel h3 {
  font-family: var(--display);
  font-size: clamp(32px, 3.6vw, 56px);
  font-weight: var(--display-weight);
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--accent-text);
  margin-block: 16px 12px;
}
body:is(.studio-home,.service-page) .contact__title,
body.studio-inner .cta h2 {
  font-family: var(--display);
  font-size: clamp(42px, 6.25vw, 96px);
  font-weight: var(--display-weight);
  line-height: 1.06;
  letter-spacing: -.025em;
}
body.studio-inner .archive-category { font-size: clamp(28px,3vw,44px); }
body.studio-inner .archive-card__copy strong {
  font-size: clamp(18px, 1.7vw, 25px);
  line-height: 1.2;
}
body.studio-inner .next-cta .display {
  font-size: clamp(34px,4.5vw,68px);
  line-height: 1.1;
}
body .dialog__title { font-size: clamp(32px,4vw,52px); }
body.studio-home .hero__desc,
body.studio-inner :is(.hero p,.hero .lead),
body :is(.section-head__side,.about__intro p,.process-lead,.process-panel p,
  .intro p,.deliverable p,.flow-step p,.contact__bottom p,.dialog__copy) {
  font-family: var(--body);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: var(--leading-body);
  letter-spacing: 0;
  text-wrap: pretty;
}
body :is(.work-heading p,.work-player__intro p,.section-head p,
  .drawing-caption p,.gallery-note p) {
  font-family: var(--body);
  font-size: clamp(16px,1.18vw,17px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}
body.studio-home .hero__desc { max-width: 42ch; margin-block: 24px 28px; }
body :is(.intro p,.case-story p,.deliverable p,.dialog__copy) { max-width: 62ch; }
body :is(.process-lead,.process-panel p,.about__intro p) { max-width: 43ch; }
body :is(#mast-nav,.mast-toggle,.site-links,.subnav-trigger,.service-menu a) {
  font-family: var(--body);
  font-size: var(--type-ui);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .005em;
}
#mast-nav .mast-services a { line-height: 1.4; }
body .mast-services a::before { font-family: var(--body); font-weight: 500; font-size: 11px; }
body :is(.shiny-button,.nav-contact,.liquid-cta,.back-btn,.pill,.text-link) {
  font-family: var(--body);
  font-size: var(--type-ui);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .015em;
  min-height: 44px;
}
body :is(.process-tabs button,.drawing-toggle,.inquiry-form label) {
  font-family: var(--body);
  font-size: var(--type-ui);
  font-weight: 500;
  line-height: 1.4;
}
body :is(.inquiry-form input,.inquiry-form select,.inquiry-form textarea,
  #inquiryText) { font-size: 16px; line-height: 1.5; }
body :is(.work-card__category,.gallery-tile__caption,.archive-card__copy small,
  .dialog__hint,.subtitle,.notice,.studio-foot p,.film-bottom a,.lightbox__footer,
  .lightbox__header strong,.drawing-instruction,.service-tile__summary,.archive-missing) {
  font-family: var(--body);
  font-size: var(--type-small);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
}
body .studio-foot nav a { font-family: var(--body); font-size: 15px; line-height: 1.4; }
body .mono { font-family: var(--body); font-size: 13px; font-weight: 500; letter-spacing: .035em; }
/* Michroma is limited to short, existing technical labels. */
body :is(.work-player__seek-labels,.hero-meta .mono,.service-ui .ui-top,
  .service-ui .ui-footer,.vhs-intro,.vhs-time,.vhs-bars) {
  font-family: var(--tech);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.5;
}
body :is(.work-player__seek-labels,.hero-meta .mono):lang(el) { font-family: var(--body); }
body .cinematic-footer .film-mark {
  font-family: var(--body); font-size: clamp(15px,1.25vw,18px);
  font-weight: 500; line-height: 1.5; letter-spacing: .18em;
}
body .cinematic-footer .film-title {
  font-family: var(--display);
  font-size: clamp(32px,4.1vw,64px);
  font-weight: var(--display-weight); line-height: 1.16; letter-spacing: .025em;
}
body .cinematic-footer .film-founder {
  font-family: var(--body); font-size: 14px; font-weight: 400;
  line-height: 1.5; letter-spacing: .1em;
}
body .cinematic-footer .film-founder strong {
  font-family: var(--display); font-size: clamp(25px,3vw,44px);
  font-weight: var(--display-weight); line-height: 1.2; letter-spacing: .025em;
}
body .cinematic-footer .film-nav a {
  font-family: var(--body); font-size: 15px;
  font-weight: 500; line-height: 1.4; letter-spacing: .06em;
}
body .film-copyright { font-family: var(--body); font-size: 13px; letter-spacing: .035em; }
@media (max-width: 780px) {
  :root { --type-ui: 15px; }
}
@media (max-width: 720px) {
  :root {
    --type-hero: clamp(40px, 10.3vw, 60px);
    --type-h1: clamp(36px,9.5vw,56px);
    --type-h2: clamp(32px,8.7vw,48px);
    --type-h3: clamp(23px,6.2vw,30px);
    --type-card: clamp(20px,5.4vw,28px);
    --tracking-display: -.018em;
    --tracking-heading: -.015em;
  }
  body.studio-home .hero__title { max-width: 13ch; }
  body.studio-home .service-tile__name { font-size: clamp(16px,4.15vw,24px); }
  body.studio-home .service-tile__summary { font-size: 13px; }
  body.studio-home .drawing-panel .diptych__name { font-size: clamp(23px,6.1vw,36px); }
  body.studio-home .drawing-caption p { font-size: 14px; line-height: 1.5; }
  body.studio-home .work-player .work-card__project { font-size: 23px; }
  body:is(.studio-home,.service-page) .contact__title { font-size: clamp(36px,9.2vw,54px); }
  body.studio-home .process-panel h3 { font-size: 32px; }
  body.studio-home .process-panels { min-height: 160px; }
  body.studio-home .process-pictures { height: min(40svh,calc(100svh - 510px)); }
  body :is(.work-player__seek-labels,.hero-meta .mono) { font-size: 10px; }
  body .work-player__seek-labels { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce), (max-height:650px) {
  body.studio-home .process-panels { min-height: 0; }
}

/* Set the whole display role to Commissioner on Greek page/section roots. */
:where(html,main,section,article,div)[lang|="el"] {
  --display: var(--body);
  --display-weight: 700;
  --leading-display: 1.16;
  --leading-heading: 1.16;
}
body.studio-home .hero__title:lang(el),
body.studio-inner main .hero h1:lang(el),
body.studio-inner main .hero:has(.hero__media) h1:lang(el) {
  font-family: var(--body);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -.01em;
}