/* Hallmark · pre-emit critique: P4 H5 E4 S5 R5 V4
 * Modern-minimal · product studio · existing 1confirmed palette
 * Space Grotesk / DM Sans · original editorial hero and film stage, illustrated service index.
 * Scoped by the landing layout's studio opt-in; active theme colours remain live.
 */
:root[data-skin="studio"] {
    --ln-font-editorial-display: 'Newsreader', Georgia, 'Times New Roman', serif;
    --ln-font-editorial-ui: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    --ln-edge: 10px;
    --ln-edge-lg: 20px;
    --ln-stage-edge: 16px;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
    --ln-studio-rule: color-mix(in oklab, var(--color-ink) 12%, var(--color-paper-raised));
    --ln-studio-soft: color-mix(in oklab, var(--color-accent) 5%, var(--color-paper-raised));
}
body { min-height: 100svh; }
[hidden] { display: none !important; }
:is(h1, h2, h3) { min-width: 0; overflow-wrap: anywhere; text-wrap: balance; }
:is(button, input, select, textarea) { font-family: var(--font-sans); }
:is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 4px;
}
.ln-btn { border-radius: 100px; padding: 15px 22px; font-size: 14px; }
.ln-btn--sm { min-height: 42px; padding: 12px 18px; font-size: 13px; }
.ln-btn--accent:hover { transform: none; }
.ln-roll__face--in { display: none; }
.ln-tail-head__eyebrow { color: var(--color-accent); font-family: var(--font-sans); font-size: 10px; letter-spacing: .1em; margin-bottom: 10px; }
.ln-tail-head__eyebrow::before { display: none; }
.ln-strip { display: block; margin-block: 0; padding-block: 44px; }
.ln-strip__lead { text-align: center; font-size: 12px; color: var(--color-muted); }
.ln-strip__second { display: inline; margin-inline-start: .35em; }
.ln-ground { background: var(--color-paper-raised); }
.ln-ground::before { display: none; }
.ln-tail-services { padding-block: clamp(3rem, 7vw, 5.5rem) 0; border-top: 1px solid var(--ln-studio-rule); }
.ln-tail-head { gap: 18px; border: 0; padding-bottom: 0; }
.ln-tail-head__title { max-width: 19ch; font-size: clamp(2rem, 3.7vw, 3.1rem); font-weight: 500; line-height: 1.1; }
.ln-tail-head__lede { max-width: 42ch; margin: 0; padding: 0; font-size: 16px; line-height: 1.65; }
.ln-service-index { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 32px; border: 0; }
.ln-service-board { --ln-service-padding: 24px; display: flex; flex-direction: column; min-width: 0; min-height: 0; padding: 0; border: 1px solid var(--ln-studio-rule); border-radius: 16px; background: var(--color-paper-raised); }
.ln-service-board__head { order: 0; justify-content: space-between; max-width: none; padding: var(--ln-service-padding) var(--ln-service-padding) 0; border: 0; }
.ln-service-board__range { order: 1; color: var(--color-muted); font-size: 10px; }
.ln-service-board__title { color: var(--color-accent); font-family: var(--font-sans); font-size: 11px; letter-spacing: .055em; }
.ln-service-board__artwork { position: relative; inset: auto; z-index: auto; order: 2; flex: none; width: 100%; height: auto; aspect-ratio: 3 / 2; margin: 0; opacity: 1; }
.ln-service-board__artwork img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ln-service-board__veil { display: none; }
.ln-service-board__list { order: 1; flex: 1; max-width: none; margin: 0; padding: 8px var(--ln-service-padding) var(--ln-service-padding); }
.ln-service-board__item { grid-template-columns: minmax(0, 1fr); gap: 0; padding-block: 12px; }
.ln-service-board__item:last-child { padding-bottom: 0; }
.ln-service-board__num { display: none; }
.ln-service-board__name { font-family: var(--font-sans); font-size: 16px; font-weight: 700; line-height: 1.35; }
.ln-service-board__note { font-size: 13px; line-height: 1.65; }
.ln-tail-api { margin-top: clamp(3rem, 7vw, 5.5rem); background: var(--color-paper); }
.ln-tail-api__title { max-width: 17ch; line-height: 1.15; font-weight: 500; }
.ln-tail-api__tabs { border-radius: 12px 12px 0 0; overflow: clip; }
.ln-tail-api__tab { font-size: 12px; white-space: nowrap; min-width: 0; }
.ln-tail-api__panel { border-radius: 0 0 12px 12px; }
.ln-tail-api__code { font-family: var(--font-mono); }
.ln-tail-api__docs { min-height: 44px; white-space: nowrap; }
.ln-pricing__title, .ln-contact__title { font-family: var(--font-display); max-width: 22ch; font-size: clamp(2rem, 3.7vw, 3.1rem); font-weight: 500; line-height: 1.12; }
.ln-pricing__lede, .ln-contact__lede { font-size: 16px; line-height: 1.7; }
.ln-calc { border-color: var(--ln-studio-rule); box-shadow: none; }
.ln-calc__art { display: none; }
.ln-calc__pick { min-block-size: 0; }
.ln-calc__out { background: var(--ln-studio-soft); }
.ln-contact { background: var(--color-paper); }
.ln-field__input, .ln-field__select, .ln-field__area { font-size: 16px; border-radius: 10px; }
.ln-tail-cta { background: var(--color-paper-raised); }
.ln-tail-cta__title { max-width: 21ch; line-height: 1.1; font-weight: 500; }
.ln-tail-cta .ln-tail-head__eyebrow { color: var(--color-accent); }
.ln-foot__link, .ln-foot__legal a { white-space: nowrap; }

@media (min-width: 40rem) {
    .ln-service-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 64.001rem) {
    .ln-tail-head { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 80px; align-items: end; }
    .ln-service-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 64rem) {
    .ln-tail-api__layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .ln-tail-api__intro { position: static; }
    .ln-tail-api__title { max-width: 24ch; }
    .ln-tail-api__lede { max-width: 58ch; }
    .ln-tail-api__tabs { display: flex; flex-wrap: wrap; overflow: visible; }
    .ln-tail-api__tab { flex: 1 1 auto; min-width: 0; }
}
@media (max-width: 39.999rem) {
    .ln-strip { padding-block: 32px; }
    .ln-strip__second { display: block; margin-inline-start: 0; }
    .ln-service-board { --ln-service-padding: 20px; }
    .ln-tail-head, .ln-contact__inner { grid-template-columns: minmax(0, 1fr); }
    .ln-tail-head__title { font-size: 2rem; }
    .ln-tail-api__tab { padding-inline: 9px; font-size: 11px; }
    .ln-tail-api__tab > span { display: none; }
    .ln-tail-api__code { font-size: 11px; }
    .ln-foot__nav { grid-template-columns: minmax(0, 1fr); }
    .ln-foot__col:last-child { grid-column: auto; }
}
/* The original film stage and attached tabs, restored from the editorial skin. */
#product {
    --font-sans: var(--ln-font-editorial-ui);
    --font-display: var(--ln-font-editorial-ui);
    --ln-edge-sm: 8px;
    --ln-stage-edge: 20px;
}
#product .ln-film-switcher__tab { font-weight: 400; text-transform: uppercase; letter-spacing: -.02em; }
#product .ln-film-switcher__tab.is-active { color: var(--color-ink); }
#product .ln-film-switcher__tab::after { display: none; }
#product .ln-film-switcher__tab:focus-visible { outline: 2px solid var(--color-ink-soft); outline-offset: -2px; box-shadow: none; }
/* On a phone the tab carries a 16px transparent border above it, there only to
   widen the target (landing.css). An outline follows the border box and would
   ring that empty space too; an inset shadow stops at the padding box, which is
   the tab you see. The transparent outline is kept for forced colours. */
@media (max-width: 48rem) {
    #product .ln-film-switcher__tab:focus-visible { outline-color: transparent; box-shadow: inset 0 0 0 2px var(--color-ink-soft); }
}

/* The original top section, restored at the user's request. */
.ln-hero, .ln-nav, .ln-notice {
    --font-sans: var(--ln-font-editorial-ui);
    --font-display: var(--ln-font-editorial-ui);
    font-family: var(--font-sans);
}
.ln-hero { padding-top: clamp(3rem, 7vw, 6rem); }
.ln-hero__say { display: block; }
.ln-display {
    font-family: var(--ln-font-editorial-display);
    font-size: clamp(2.75rem, 1.1rem + 5vw, 5rem);
    font-weight: 400; line-height: 1.2; letter-spacing: -.02em;
    text-wrap: wrap;
}
/* Below a tablet the headline cannot fit on one line, and a greedy wrap broke
   it wherever the width ran out: "Send it once. Know / it landed." on a 392px
   phone, "Send it once. Know it / landed." at 412px. Balanced, it breaks
   between its two sentences at every phone width. Wider, it is one line either
   way. */
@media (max-width: 48rem) {
    .ln-display { text-wrap: balance; }
}
.ln-lede { max-width: 34rem; margin-top: var(--space-lg); font-size: 1.25rem; line-height: 1.35; letter-spacing: -.02em; }
.ln-hero .ln-btn, .ln-nav .ln-btn {
    min-height: 48px; padding: 12px 32px; font-size: 13px; font-weight: 400;
    text-transform: uppercase; letter-spacing: -.02em;
}
.ln-nav .ln-btn--sm { min-height: 44px; padding: 11px 24px; font-size: 12.5px; }
.ln-catch { border-radius: 100px; box-shadow: none; }
.ln-catch__field { font-family: var(--font-sans); }
.ln-hero .ln-catch__note { font-size: 12px; }
.ln-notice__link { text-transform: uppercase; white-space: nowrap; }
:root[data-skin="studio"][lang|="ar"] {
    --ln-font-editorial-display: 'Amiri', Georgia, serif;
    --ln-font-editorial-ui: 'IBM Plex Sans Arabic', ui-sans-serif, system-ui, sans-serif;
}