@font-face { font-family: 'Barlow Condensed'; src: url('assets/barlow-condensed.woff2') format('woff2'); font-weight: 600; font-display: swap; }
.studio-cover-label { position: absolute; top: 14px; left: 14px; z-index: 1; padding: 5px 8px; background: #ffffffe8; color: #35545b; font-size: 8px; line-height: 1.6; letter-spacing: .025em; pointer-events: none; }
.studio-cover-label[hidden] { display: none; }
.car-media:has(.studio-cover-label) .car-kind { top: auto; bottom: 12px; }
.studio .car-media:has(.studio-cover-label) { background: #e6e6e3; }
.studio .car-media:has(.studio-cover-label) img { object-fit: contain; }

/* The photographic opening returns; the quieter identity continues below it. */
.studio[data-page='index'] .studio-header { position: absolute; top: 0; left: 0; right: 0; background: transparent; }
.studio[data-page='index'] .studio-brand img { filter: brightness(0) invert(1); }
.hero-immersive { padding: 0; height: 100svh; min-height: 760px; max-height: 1200px; position: relative; overflow: hidden; isolation: isolate; }
.hero-immersive .campaign-imagery,.hero-immersive .campaign-shade { position: absolute; inset: 0; z-index: -1; }
.hero-immersive .campaign-photo { object-position: 62% 55%; transform: scale(1.06); }
.hero-immersive .campaign-shade { background: linear-gradient(90deg,#03111875,transparent 74%),linear-gradient(0deg,#031118db,transparent 44%),linear-gradient(180deg,#03111865,transparent 40%); }
.hero-immersive .campaign-topline { position: absolute; top: 128px; left: var(--gutter); right: var(--gutter); display: flex; justify-content: space-between; gap: 30px; font-size: 9px; letter-spacing: .13em; }
.studio .immersive-title { position: absolute; left: calc(var(--gutter) - 5px); top: 19.8%; font: 600 clamp(120px,14.8vw,240px)/.82 'Barlow Condensed',Impact,sans-serif; letter-spacing: -.025em; color: white; margin: 0; }
.immersive-title>.title-line { display: block; }
.immersive-title .title-line>span { display: block; }
.hero-immersive .campaign-bottom { position: absolute; bottom: 150px; left: var(--gutter); right: var(--gutter); display: flex; justify-content: space-between; align-items: end; gap: 50px; }
.hero-immersive .campaign-brief>p { font-size: 15px; line-height: 1.7; color: #edf2f2; }
.hero-immersive .round-link { display: inline-flex; align-items: center; gap: 28px; padding-top: 21px; font-size: 13px; }
.hero-immersive .round-link>span { width: 49px; height: 49px; border: 1px solid #ffffff80; border-radius: 50%; display: grid; place-items: center; transition: background .25s; }
.hero-immersive .round-link svg { width: 22px; height: 22px; }
.hero-immersive .round-link:hover>span { color: var(--deep); background: var(--orange); border-color: var(--orange); }
.hero-immersive .scene-switch button { border-bottom: 1px solid #ffffff50; padding: 9px 0; }
.hero-immersive .scene-switch button[aria-pressed='true'] { border-color: white; }
.hero-immersive .campaign-routes { position: absolute; bottom: 0; left: var(--gutter); right: var(--gutter); border-top: 1px solid #ffffff50; padding-block: 24px; gap: 50px; }
.hero-immersive .campaign-routes a { font: 13px var(--body); }
.hero-immersive .campaign-routes a+a { border: 0; padding-left: 0; }

/* Original vector marks double as meaningful navigation. */
.make-directory { display: grid; grid-template-columns: 1fr 3fr; gap: 45px; padding-block: 41px; border-bottom: 1px solid var(--line); }
.make-directory-label { display: flex; flex-direction: column; justify-content: center; }
.make-directory-label .eyebrow { font-size: 9px; color: var(--muted); margin-bottom: 8px; text-transform: none; letter-spacing: .015em; }
.make-directory-label>span { font: 400 21px/1.2 var(--display); letter-spacing: -.035em; }
.make-directory-links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.make-directory-links>a { padding: 0 35px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.make-directory-links>a+a { border-left: 1px solid var(--line); }
.make-directory-links img { width: 112px; height: 52px; object-fit: contain; transition: transform .3s; }
.make-directory-links>a:last-child img { width: 49px; }
.make-directory-links>a:nth-child(2) img { width: 75px; }
.make-directory-links>a>span { font-size: 9px; color: var(--muted); white-space: nowrap; }
.make-directory-links svg { display: block; width: 17px; height: 17px; margin: 9px 0 0 auto; color: var(--ink); }
.make-directory-links a:hover img { transform: translateY(-4px); }
.make-logo { width: 95px; height: 40px; object-fit: contain; object-position: left center; }
.make-logo[src*='mercedes'] { width: 43px; height: 43px; }
.make-logo[src*='kia'] { width: 76px; }

/* Sales opens as a collection, not another campaign. */
.inventory-opening { background: var(--paper); }
.inventory-opening-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 100px; align-items: center; padding-block: 45px; }
.inventory-opening .eyebrow { color: var(--muted); margin-bottom: 20px; }
.inventory-opening h1 { font-size: clamp(54px,6.7vw,96px); line-height: 1; }
.inventory-opening p:not(.eyebrow) { font-size: 14px; color: var(--muted); margin-top: 25px; line-height: 1.8; }
.inventory-opening figure { max-width: 440px; margin-left: auto; width: 100%; }
.inventory-opening figure img { width: 100%; height: auto; aspect-ratio: 2; object-fit: cover; object-position: center 55%; }
.inventory-opening figcaption { font-size: 9px; color: var(--muted); margin-top: 10px; text-align: right; }
.studio[data-page='inventory'] .make-directory { padding-block: 31px; }
.studio[data-page='inventory'] .catalogue-toolbar { background: white; }

/* A destination first, followed by a useful rental search. */
.rental-opening { height: 490px; position: relative; isolation: isolate; background: var(--deep); color: white; }
.rental-opening>img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; z-index: -2; }
.rental-opening::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#041b25e6,#041b2530 85%); z-index: -1; }
.rental-opening>.wrap { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: start; }
.rental-opening .eyebrow { color: #d2e1e5; margin-bottom: 23px; }
.rental-opening h1 { font-size: clamp(54px,5.8vw,83px); line-height: 1.03; }
.rental-opening p:not(.eyebrow) { color: #d5e0e3; font-size: 14px; margin-top: 24px; line-height: 1.8; }
.rental-opening-place { position: absolute; right: var(--gutter); bottom: 25px; color: #c9d8de; font-size: 9px; letter-spacing: .03em; }
.rental-service-line { display: flex; justify-content: space-between; gap: 30px; padding-block: 23px; font-size: 11px; color: var(--muted); border-bottom: 1px solid var(--line); }
.studio[data-page='rentals'] .rental-toolbar { padding-top: 33px; }

/* Vehicle detail combines the photographs with the complete listing record. */
.studio[data-page='vehicle'] #main { background: linear-gradient(#f4f6f5 0 200px,white 200px); }
.vehicle-marque { display: flex; justify-content: space-between; align-items: center; gap: 25px; padding-bottom: 19px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.vehicle-marque>span { font-size: 9px; color: var(--muted); }
.studio .vehicle-overview { padding-top: 0; }
.studio .vehicle-overview h1 { font-size: clamp(35px,3.6vw,56px); margin-block: 16px 24px; }
.vehicle-pricing { border-block: 1px solid var(--line); padding-block: 18px; margin-bottom: 10px; }
.pricing-label { color: var(--muted); font-size: 10px; }
.studio .vehicle-pricing .car-price { border: none; margin: 5px 0 0; padding: 0; font-size: 35px; }
.price-previous { font-size: 10px; color: var(--muted); margin-top: 8px; }
.price-previous del { margin-left: 12px; }
.specification-jump { display: inline-flex; align-items: center; gap: 32px; font-size: 11px; padding: 17px 0 12px; }
.specification-jump svg { width: 18px; height: 18px; }
.technical-section { margin-top: 55px; padding-top: 36px; border-top: 1px solid var(--ink); scroll-margin-top: 30px; }
.technical-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 29px; }
.technical-heading .eyebrow { color: var(--muted); font-size: 9px; margin-bottom: 12px; }
.technical-heading h2 { font-size: 35px; line-height: 1.14; }
.technical-heading>span { font-size: 10px; color: var(--muted); }
.vehicle-technical-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0 38px; margin: 0; }
.vehicle-technical-grid>div { padding: 20px 0; border-top: 1px solid var(--line); }
.vehicle-technical-grid>.engine-spec { grid-column: span 2; }
.vehicle-technical-grid dt { font-size: 10px; color: var(--muted); }
.vehicle-technical-grid dd { font-size: 14px; margin: 8px 0 0; line-height: 1.6; }
.vehicle-story-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 130px; padding-top: 55px; padding-bottom: 85px; align-items: start; }
.seller-notes>.eyebrow { color: var(--muted); margin-bottom: 13px; }
.seller-notes h2 { font-size: 35px; margin-bottom: 26px; }
.seller-notes>p:not(.eyebrow) { font-size: 14px; line-height: 1.95; color: var(--muted); }
.vehicle-visit { padding: 31px 0 0 32px; border-top: 1px solid var(--ink); border-left: 1px solid var(--line); }
.vehicle-visit>.eyebrow { color: var(--muted); font-size: 9px; }
.vehicle-visit h3 { font: 400 31px/1.13 var(--display); letter-spacing: -.045em; margin: 25px 0 18px; }
.vehicle-visit>p:not(.eyebrow) { font-size: 12px; line-height: 1.9; color: var(--muted); max-width: 290px; }
.visit-phone { display: flex; align-items: center; gap: 24px; margin-top: 28px; font-size: 17px; letter-spacing: -.02em; }
.visit-phone svg { width: 20px; height: 20px; }
.vehicle-visit .text-link { margin-top: 17px; font-size: 11px; }

/* The import story has its own photographic subject and a clear process. */
.import-opening { color: white; background: var(--deep); padding-block: 58px 50px; }
.import-opening>.wrap { display: grid; grid-template-columns: .95fr 1.15fr; align-items: center; gap: 95px; }
.import-opening-copy>.eyebrow { color: #9db9c3; margin-bottom: 28px; }
.import-opening h1 { font-size: clamp(47px,5.5vw,78px); line-height: 1.04; }
.import-opening-copy>p:not(.eyebrow) { font-size: 13px; line-height: 1.9; color: #bfd1d7; max-width: 330px; margin-top: 28px; }
.import-opening .studio-button { margin-top: 29px; }
.import-opening figure img { width: 100%; height: auto; aspect-ratio: 1.08; object-fit: cover; }
.import-opening figcaption { display: flex; justify-content: space-between; gap: 25px; padding-top: 17px; color: #aac2ca; font-size: 9px; }
.studio[data-page='import'] .process-row { position: relative; padding-left: 30px; }
.studio[data-page='import'] .process-row::before { content: ''; position: absolute; left: 0; top: 34px; width: 9px; height: 9px; border: 1px solid #b8c3c5; }
.studio[data-page='import'] .faq-section { background: var(--paper); }


.studio[data-page='about'] .about-banner .copy { background: var(--deep); }

/* Contact is direct, with the phone as an action rather than decoration. */
.contact-opening { background: var(--deep); color: white; padding-block: 62px; }
.contact-opening>.wrap { display: flex; justify-content: space-between; align-items: center; gap: 80px; }
.contact-opening .eyebrow { color: #a8c3cc; margin-bottom: 24px; }
.contact-opening h1 { font-size: clamp(51px,5.7vw,82px); line-height: 1.1; }
.contact-opening p:not(.eyebrow) { color: #c1d3d8; font-size: 13px; margin-top: 28px; line-height: 1.9; }
.contact-opening-call { border-left: 1px solid #ffffff40; padding: 16px 0 16px 60px; position: relative; padding-right: 85px; }
.contact-opening-call>span { display: block; color: #a8c3cc; font-size: 10px; margin-bottom: 18px; }
.contact-opening-call strong { font: 400 clamp(34px,4.3vw,62px)/1.12 var(--display); letter-spacing: -.045em; }
.contact-opening-call svg { width: 40px; height: 40px; position: absolute; right: 0; bottom: 24px; color: var(--orange); }
.studio[data-page='contact'] .contact-layout { margin-top: 55px; }
.studio[data-page='contact'] .contact-form { border-top: 2px solid var(--orange); }

/* The journal reads as a publication, and articles retain a quiet reading measure. */
.journal-opening { padding-top: 40px; padding-bottom: 43px; }
.journal-masthead { display: flex; justify-content: space-between; gap: 30px; padding-block: 16px; border-block: 1px solid var(--ink); font-size: 9px; color: var(--muted); }
.journal-opening h1 { font: 400 clamp(58px,8.2vw,117px)/1.07 var(--display); letter-spacing: -.055em; margin-top: 30px; }
.journal-opening>p { font-size: 13px; color: var(--muted); margin-top: 18px; }
.studio[data-page='journal'] .journal-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 50px; }
.studio[data-page='journal'] .journal-list article:first-child { grid-column: 1/-1; grid-row: auto; display: grid; grid-template-columns: 1.1fr 1fr; gap: 0 60px; align-content: center; background: var(--paper); padding: 30px; }
.studio[data-page='journal'] .journal-list article:first-child .article-cover { grid-row: 1/4; aspect-ratio: 1.5; }
.studio[data-page='journal'] .journal-list article:first-child .eyebrow { margin: 5px 0 17px; }
.studio[data-page='journal'] .journal-list article:first-child h2 { font-size: 39px; }
.studio[data-page='journal'] .journal-list article:first-child .text-link { justify-self: start; }
.studio[data-page='article'] .article-intro { max-width: 1060px; padding-block: 50px; }
.studio[data-page='article'] .article-layout { border-top: 1px solid var(--line); padding-top: 40px; }

@media(max-width:1100px) {
  .make-directory { grid-template-columns: 1fr 3.5fr; gap: 20px; }
  .make-directory-links>a { padding-inline: 22px; gap: 20px; }
  .make-directory-links img { width: 90px; }
  .inventory-opening-grid { gap: 55px; }
  .vehicle-story-grid { gap: 70px; }
  .import-opening>.wrap { gap: 55px; }
  .contact-opening-call { padding-left: 35px; padding-right: 60px; }
  .contact-opening-call svg { width: 32px; height: 32px; }
}
@media(max-width:800px) {
  .hero-immersive .campaign-topline { top: 119px; }
  .hero-immersive .campaign-bottom { bottom: 140px; }
  .make-directory { display: block; padding-block: 30px; }
  .make-directory-label { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: 25px; }
  .make-directory-label .eyebrow { margin: 0; font-size: 9px; }
  .make-directory-label>span { font-size: 17px; }
  .make-directory-links>a { padding-inline: 25px; }
  .make-directory-links>a:first-child { padding-left: 0; }
  .make-directory-links>a:last-child { padding-right: 0; }
  .inventory-opening-grid { grid-template-columns: 1.3fr 1fr; gap: 35px; }
  .inventory-opening h1 { font-size: 52px; }
  .inventory-opening p:not(.eyebrow) { font-size: 12px; }
  .inventory-opening figure img { aspect-ratio: 1.4; }
  .vehicle-technical-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 25px; }
  .vehicle-story-grid { gap: 45px; grid-template-columns: 1.4fr 1fr; }
  .vehicle-visit { padding-left: 23px; }
  .visit-phone { font-size: 14px; gap: 14px; }
  .vehicle-visit h3 { font-size: 27px; }
  .import-opening>.wrap { gap: 40px; }
  .import-opening h1 { font-size: 48px; }
  .import-opening figure img { aspect-ratio: .7; }
  .import-opening figcaption { display: block; line-height: 1.9; }
  .import-opening figcaption span { display: block; }
  .contact-opening>.wrap { gap: 40px; }
  .contact-opening h1 { font-size: 53px; }
  .contact-opening-call { padding-left: 28px; padding-right: 40px; }
  .contact-opening-call strong { font-size: 36px; }
  .contact-opening-call svg { width: 25px; height: 25px; }
  .studio[data-page='journal'] .journal-list article:first-child { gap: 0 30px; padding: 23px; }
  .studio[data-page='journal'] .journal-list article:first-child .article-cover { aspect-ratio: .9; }
  .studio[data-page='journal'] .journal-list article:first-child h2 { font-size: 30px; }
}
@media(max-width:600px) {
  .hero-immersive { min-height: 760px; height: 100svh; }
  .hero-immersive .campaign-photo { object-position: 68% 55%; transform: scale(1.03); }
  .hero-immersive .campaign-shade { background: linear-gradient(0deg,#031118e6,transparent 49%),linear-gradient(90deg,#03111845,transparent 95%),linear-gradient(180deg,#03111865,transparent 55%); }
  .hero-immersive .campaign-topline { top: 117px; font-size: 8px; }
  .hero-immersive .campaign-topline>span:last-child { display: none; }
  .studio .immersive-title { left: 20px; top: 20%; font-size: 25.3vw; line-height: .86; letter-spacing: -.02em; }
  .hero-immersive .campaign-bottom { bottom: 137px; flex-direction: column; align-items: start; gap: 17px; }
  .hero-immersive .campaign-brief>p { font-size: 12px; }
  .hero-immersive .round-link { font-size: 12px; gap: 23px; padding-top: 16px; }
  .hero-immersive .round-link>span { width: 43px; height: 43px; }
  .hero-immersive .scene-switch { gap: 22px; }
  .hero-immersive .scene-switch button { font-size: 9px; padding-block: 6px; }
  .hero-immersive .campaign-routes { gap: 20px; padding-block: 23px; }
  .hero-immersive .campaign-routes a { font-size: 10px; gap: 7px; }
  .make-directory { padding-block: 28px; }
  .make-directory-label { margin-bottom: 24px; }
  .make-directory-label .eyebrow { font-size: 8px; }
  .make-directory-label>span { font-size: 16px; }
  .make-directory-links>a { display: flex; flex-direction: column; gap: 10px; padding: 0 17px; }
  .make-directory-links img { width: 88px; height: 38px; }
  .make-directory-links>a:nth-child(2) img { width: 65px; }
  .make-directory-links>a:last-child img { width: 38px; }
  .make-directory-links>a>span { font-size: 9px; display: flex; gap: 18px; align-items: center; }
  .make-directory-links svg { width: 14px; height: 14px; margin: 0; }
  .inventory-opening-grid { display: block; padding-block: 35px; }
  .inventory-opening h1 { font-size: 52px; }
  .inventory-opening .eyebrow { margin-bottom: 20px; }
  .inventory-opening p:not(.eyebrow) { margin-top: 22px; }
  .inventory-opening figure { margin-top: 26px; max-width: none; }
  .inventory-opening figure img { aspect-ratio: 2.2; }
  .rental-opening { height: 440px; }
  .rental-opening>img { object-position: 57% 50%; }
  .rental-opening h1 { font-size: 50px; }
  .rental-opening .eyebrow { font-size: 9px; }
  .rental-opening p:not(.eyebrow) { font-size: 12px; }
  .rental-opening-place { font-size: 8px; }
  .rental-service-line { gap: 14px; font-size: 9px; padding-block: 20px; align-items: start; }
  .rental-service-line>span { max-width: 85px; }
  .vehicle-marque { margin-bottom: 20px; padding-bottom: 16px; }
  .make-logo { width: 90px; height: 35px; }
  .make-logo[src*='mercedes'] { width: 36px; height: 36px; }
  .make-logo[src*='kia'] { width: 70px; }
  .vehicle-marque>span { font-size: 8px; }
  .studio .vehicle-overview h1 { font-size: 39px; margin-block: 14px 23px; }
  .studio .vehicle-pricing .car-price { font-size: 34px; }
  .price-previous { font-size: 9px; }
  .technical-section { margin-top: 36px; padding-top: 27px; }
  .technical-heading { display: block; margin-bottom: 24px; }
  .technical-heading h2 { font-size: 29px; }
  .technical-heading>span { display: block; margin-top: 15px; font-size: 9px; }
  .vehicle-technical-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 25px; }
  .vehicle-technical-grid>div { padding-block: 17px; }
  .vehicle-technical-grid dt { font-size: 9px; }
  .vehicle-technical-grid dd { font-size: 13px; margin-top: 7px; }
  .vehicle-story-grid { grid-template-columns: minmax(0,1fr); gap: 39px; padding-top: 39px; padding-bottom: 55px; }
  .seller-notes h2 { font-size: 29px; margin-bottom: 23px; }
  .seller-notes>.eyebrow { font-size: 9px; }
  .seller-notes>p:not(.eyebrow) { font-size: 13px; line-height: 1.9; }
  .vehicle-visit { padding: 27px 0 0; border-left: 0; display: grid; grid-template-columns: 1fr auto; gap: 0 24px; }
  .vehicle-visit>.eyebrow { grid-column: 1/-1; }
  .vehicle-visit h3 { grid-column: 1; font-size: 26px; margin-top: 22px; }
  .vehicle-visit>p:not(.eyebrow) { grid-column: 1/-1; max-width: none; }
  .visit-phone { grid-column: 1/-1; font-size: 17px; }
  .vehicle-visit .text-link { grid-column: 1/-1; justify-self: start; }
  .import-opening { padding-block: 42px; }
  .import-opening>.wrap { grid-template-columns: minmax(0,1fr); gap: 37px; }
  .import-opening h1 { font-size: 51px; }
  .import-opening-copy>.eyebrow { margin-bottom: 24px; }
  .import-opening-copy>p:not(.eyebrow) { font-size: 12px; }
  .import-opening figure img { aspect-ratio: 1.2; }
  .import-opening figcaption { display: flex; font-size: 8px; padding-top: 13px; }
  .studio[data-page='import'] .process-row { padding-left: 25px; }
  .contact-opening { padding-block: 42px; }
  .contact-opening>.wrap { flex-direction: column; align-items: start; gap: 29px; }
  .contact-opening h1 { font-size: 51px; }
  .contact-opening p:not(.eyebrow) { font-size: 12px; margin-top: 23px; }
  .contact-opening-call { padding: 25px 65px 0 0; border-left: 0; border-top: 1px solid #ffffff40; width: 100%; }
  .contact-opening-call>span { font-size: 9px; margin-bottom: 13px; }
  .contact-opening-call strong { font-size: 39px; }
  .contact-opening-call svg { bottom: 10px; }
  .studio[data-page='contact'] .contact-layout { margin-top: 38px; }
  .journal-opening { padding-block: 27px 34px; }
  .journal-masthead { font-size: 8px; gap: 20px; padding-block: 12px; }
  .journal-masthead>span:last-child { display: none; }
  .journal-opening h1 { font-size: 53px; margin-top: 25px; }
  .journal-opening>p { font-size: 12px; margin-top: 16px; }
  .studio[data-page='journal'] .journal-list { grid-template-columns: minmax(0,1fr); gap: 35px; }
  .studio[data-page='journal'] .journal-list article:first-child { display: block; padding: 18px; }
  .studio[data-page='journal'] .journal-list article:first-child .article-cover { display: block; aspect-ratio: 1.5; }
  .studio[data-page='journal'] .journal-list article:first-child .eyebrow { margin-top: 22px; margin-bottom: 14px; }
  .studio[data-page='journal'] .journal-list article:first-child h2 { font-size: 29px; }
}

/* Our story */
.story-opening { background: #f1f4f3; padding-block: 29px 0; }
.story-masthead { display: flex; justify-content: space-between; align-items: center; gap: 24px; border-bottom: 1px solid #cbd5d3; padding-bottom: 20px; }
.story-masthead .eyebrow { color: #a2480e; }
.story-masthead>span { color: #56696d; font-size: 10px; }
.story-opening-grid { display: grid; grid-template-columns: 1.03fr 1fr; gap: 65px; padding-top: 44px; align-items: center; }
.studio .story-opening h1 { font-size: clamp(58px,6.5vw,100px); line-height: 1.07; letter-spacing: -.065em; }
.story-opening h1 em { font-style: normal; color: #6c827b; }
.story-opening-copy>p { font-size: 15px; line-height: 1.9; color: #52686c; margin-top: 30px; }
.story-opening-copy .text-link { margin-top: 28px; font-size: 12px; gap: 30px; }
.story-landscape { position: relative; padding-bottom: 26px; }
.story-landscape img { display: block; width: 100%; height: auto; aspect-ratio: 1.02; object-fit: cover; object-position: 57% center; }
.story-landscape figcaption { display: flex; justify-content: space-between; gap: 20px; margin-top: 12px; color: #52686c; font-size: 9px; }
.story-photo-label { position: absolute; left: -26px; bottom: 65px; padding: 24px 28px; background: var(--deep); color: #fff; font: 400 20px/1.35 var(--display); letter-spacing: -.03em; }
.story-service-line { display: flex; justify-content: space-between; gap: 25px; padding-block: 25px; margin-top: 27px; border-top: 1px solid #cbd5d3; font-size: 10px; color: #52686c; }
.story-service-line>span:last-child { color: var(--ink); }
.story-introduction { display: grid; grid-template-columns: 1fr 1fr; gap: 105px; padding-block: 100px; }
.story-introduction .eyebrow { color: #64787b; margin-bottom: 25px; }
.studio .story-introduction h2 { font-size: clamp(34px,3.4vw,51px); line-height: 1.22; }
.story-introduction-copy>p { font-size: 14px; line-height: 1.95; color: #586d71; margin-bottom: 20px; }
.story-introduction-copy>p.story-standfirst { color: var(--ink); font-size: 20px; line-height: 1.65; }
.story-introduction-copy .text-link { margin-top: 4px; }
.story-purpose { padding-block: 77px; background: var(--deep); color: white; }
.story-purpose-heading { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.story-purpose .eyebrow { color: #bdd0d0; }
.studio .story-purpose-heading h2 { font-size: clamp(32px,3.8vw,55px); }
.story-principles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 49px; gap: 52px; }
.story-principles article { border-top: 1px solid #ffffff3b; padding-top: 18px; }
.story-principles article>span { font-size: 11px; color: #ffad65; }
.story-principles h3 { font: 400 25px/1.25 var(--display); letter-spacing: -.035em; margin: 31px 0 16px; }
.story-principles p { font-size: 13px; line-height: 1.9; color: #bfd1d3; max-width: 320px; }
.story-mission { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; margin-top: 56px; border-top: 1px solid #ffffff3b; padding-top: 29px; }
.story-mission>div { display: grid; grid-template-columns: 100px 1fr; gap: 23px; }
.story-mission p:not(.eyebrow) { font-size: 13px; line-height: 1.85; color: #bfd1d3; max-width: 340px; }
.story-team { padding-block: 93px; scroll-margin-top: 25px; }
.story-team-heading { display: flex; align-items: end; justify-content: space-between; gap: 45px; padding-bottom: 58px; }
.story-team-heading .eyebrow { color: #64787b; margin-bottom: 23px; }
.studio .story-team-heading h2 { font-size: clamp(38px,4.3vw,62px); line-height: 1.15; }
.story-team-heading>p { color: #586d71; font-size: 13px; line-height: 1.9; padding-bottom: 5px; }
.story-group-title { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 17px; border-top: 1px solid var(--ink); margin-bottom: 25px; }
.story-group-title h3 { font: 400 17px var(--display); letter-spacing: -.02em; }
.story-group-title>span { color: #586d71; font-size: 10px; }
.story-directors { display: grid; grid-template-columns: 1fr 1fr; gap: 55px; padding-bottom: 60px; }
.story-directors .story-person { display: grid; grid-template-columns: minmax(145px,205px) 1fr; gap: 26px; align-items: center; }
.story-person-photo { background: #fff; display: flex; align-items: end; justify-content: center; overflow: hidden; }
.story-person-photo img { display: block; width: 100%; height: auto; aspect-ratio: .85; object-fit: contain; object-position: center bottom; }
.story-person-copy .story-person-role { font-size: 10px; line-height: 1.6; color: #8d470f; margin-bottom: 13px; }
.story-person h3 { font: 500 18px/1.4 var(--display); letter-spacing: -.035em; margin-bottom: 15px; }
.story-person-copy>p:last-child { color: #586d71; font-size: 12px; line-height: 1.85; }
.story-management { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 45px; }
.story-management .story-person-photo { height: 275px; }
.story-management .story-person-photo img { width: auto; max-width: 100%; height: 100%; aspect-ratio: auto; }
.story-management .story-person-copy { padding-top: 22px; }
.story-management .story-person-role { margin-bottom: 7px; }
.story-management h3 { margin-bottom: 9px; }
.story-colleague { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; border-top: 1px solid var(--line); padding-top: 26px; margin-top: 40px; }
.story-colleague .eyebrow { color: #8d470f; font-size: 10px; margin-bottom: 8px; }
.story-colleague h3 { font: 500 16px/1.5 var(--display); letter-spacing: -.02em; }
.story-colleague>p { font-size: 12px; color: #586d71; }

@media(max-width:1100px) {
  .story-opening-grid { gap: 40px; }
  .story-introduction { gap: 60px; }
  .story-directors { gap: 35px; }
  .story-directors .story-person { grid-template-columns: 1fr; gap: 23px; align-content: start; }
  .story-directors .story-person-photo { height: 285px; }
  .story-directors .story-person-photo img { width: auto; max-width: 100%; height: 100%; }
  .story-mission { gap: 40px; }
  .story-mission>div { grid-template-columns: 1fr; gap: 12px; }
}
@media(max-width:800px) {
  .studio .story-opening h1 { font-size: 61px; }
  .story-opening-grid { grid-template-columns: 1fr 1fr; gap: 35px; }
  .story-landscape img { aspect-ratio: .72; }
  .story-opening-copy>p { font-size: 13px; }
  .story-opening-copy .text-link { gap: 15px; font-size: 10px; }
  .story-photo-label { left: -17px; padding: 18px; font-size: 17px; }
  .story-introduction { padding-block: 65px; gap: 40px; }
  .story-introduction-copy>p.story-standfirst { font-size: 17px; }
  .story-introduction-copy>p { font-size: 13px; }
  .story-principles { gap: 27px; }
  .story-principles h3 { font-size: 21px; }
  .story-team-heading { align-items: start; flex-direction: column; gap: 25px; padding-bottom: 37px; }
  .story-management { gap: 23px; }
  .story-management .story-person-photo { height: 210px; }
  .story-person h3 { font-size: 16px; }
}
@media(max-width:600px) {
  .story-opening { padding-top: 22px; }
  .story-masthead { padding-bottom: 17px; }
  .story-masthead>span { font-size: 8px; }
  .story-masthead .eyebrow { font-size: 9px; }
  .story-opening-grid { grid-template-columns: 1fr; gap: 30px; padding-top: 33px; }
  .studio .story-opening h1 { font-size: clamp(51px,12.8vw,75px); }
  .story-opening-copy>p { margin-top: 22px; }
  .story-opening-copy .text-link { margin-top: 17px; font-size: 11px; gap: 25px; }
  .story-landscape { padding-bottom: 16px; }
  .story-landscape img { aspect-ratio: 1.2; }
  .story-photo-label { left: 16px; bottom: 52px; font-size: 18px; }
  .story-landscape figcaption { font-size: 8px; }
  .story-service-line { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding-block: 21px; font-size: 9px; }
  .story-service-line>span:nth-child(even) { text-align: right; }
  .story-introduction { grid-template-columns: 1fr; gap: 28px; padding-block: 54px; }
  .story-introduction .eyebrow { margin-bottom: 20px; }
  .studio .story-introduction h2 { font-size: 33px; }
  .story-introduction-copy>p.story-standfirst { font-size: 18px; }
  .story-introduction-copy>p { margin-bottom: 18px; }
  .story-purpose { padding-block: 47px; }
  .story-purpose-heading { display: block; }
  .story-purpose-heading .eyebrow { margin-bottom: 20px; }
  .studio .story-purpose-heading h2 { font-size: 33px; }
  .story-principles { grid-template-columns: 1fr; gap: 28px; margin-top: 33px; }
  .story-principles article { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding-top: 22px; }
  .story-principles article>span { padding-top: 3px; }
  .story-principles h3 { margin: 0; font-size: 24px; }
  .story-principles p { grid-column: 2; font-size: 13px; }
  .story-mission { grid-template-columns: 1fr; gap: 26px; margin-top: 35px; }
  .story-team { padding-block: 55px; }
  .studio .story-team-heading h2 { font-size: 38px; }
  .story-team-heading>p { font-size: 12px; }
  .story-team-heading .eyebrow { font-size: 9px; margin-bottom: 20px; }
  .story-group-title { margin-bottom: 23px; }
  .story-group-title h3 { font-size: 15px; }
  .story-group-title>span { font-size: 9px; }
  .story-directors { grid-template-columns: 1fr; gap: 31px; padding-bottom: 37px; }
  .story-directors .story-person { grid-template-columns: .85fr 1fr; gap: 23px; }
  .story-directors .story-person-photo { height: 210px; }
  .story-person-copy .story-person-role { font-size: 9px; }
  .story-person h3 { font-size: 16px; margin-bottom: 10px; }
  .story-person-copy>p:last-child { font-size: 11px; }
  .story-management { grid-template-columns: 1fr; gap: 28px; }
  .story-management .story-person { display: grid; grid-template-columns: .85fr 1fr; align-items: center; gap: 23px; }
  .story-management .story-person-photo { height: 210px; }
  .story-management .story-person-copy { padding-top: 0; }
  .story-colleague { grid-template-columns: 1fr; gap: 12px; margin-top: 29px; padding-top: 24px; }
  .story-colleague h3 { font-size: 14px; }
}