/* corralejolawyers.com — "Lawyers in Corralejo" landing (adeje's twin) (APP-owned stylesheet). v1.
 *
 * Direction: the "Posicionamiento de Olga Caballero" Claude Design handoff
 * (~/design/corralejolawyers.com on control, Lawyers in Adeje v4.dc.html) ported
 * 1:1 — Classical design system + the chocolate brand override block.
 * Single-page EN landing; light/dark section alternation; colour applied as
 * stroke, rule and underline (the CTA button is the one filled element).
 *
 * Type: Marcellus 400 (display; never bold) + Lora variable 400-600 (body;
 * 600 only on the CTA label). Self-hosted (CSP zero external origins).
 * Zero inline styles. Tabular figures wherever digits render.
 */

@font-face {
    font-family: 'Marcellus';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/marcellus-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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: 'Marcellus';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/marcellus-400-latin.woff2') format('woff2');
    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: 'Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/lora-vf-cyrillic-ext.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/lora-vf-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/lora-vf-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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: 'Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/lora-vf-latin.woff2') format('woff2');
    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;
}

/* ── Tokens — the Classical system under the chocolate brand override ────── */
:root {
    --al-font-heading: 'Marcellus', 'Cormorant Garamond', serif;
    --al-font-body: 'Lora', Georgia, serif;

    --al-accent: #493d3a;          /* numerals, marks, watermark, thread */
    --al-accent-100: #eeeae8;
    --al-accent-200: #ddd5d2;
    --al-accent-300: #c3b7b2;
    --al-accent-400: #a18d85;      /* accent on DARK grounds */
    --al-accent-600: #3e3330;      /* CTA fill/border; link hover */
    --al-accent-700: #332a27;      /* accent on LIGHT grounds; CTA hover */
    --al-bg: #f4f1ee;              /* page ground; text colour on dark */
    --al-surface: #fbf9f7;         /* plate mat */
    --al-text: #26201d;
    --al-divider: #e2dad4;
    --al-dark: #1e1815;            /* the three dark sections */

    --al-maxw: 1240px;
    --al-pad: clamp(20px, 5vw, 72px);
    /* full-bleed sections: edge-to-edge ground, text on the 1240px column */
    --al-bleed-pad: max(var(--al-pad), calc((100% - var(--al-maxw)) / 2 + var(--al-pad)));
    --al-radius: 4px;

    /* --mod-* contract: the core module library renders in this brand */
    --mod-bg: var(--al-bg);
    --mod-fg: var(--al-text);
    --mod-muted: rgba(38, 32, 29, 0.7);
    --mod-accent: var(--al-accent);
    --mod-accent-fg: var(--al-bg);
    --mod-surface: var(--al-surface);
    --mod-line: var(--al-divider);
    --mod-radius: var(--al-radius);
    --mod-maxw: var(--al-maxw);
    --mod-space: 21px;
}

/* ── Base ────────────────────────────────────────────────────────────────── */
/* Global resets the CORE sheets rely on (public-core.css / modules.css ship
   none of their own — the seed's site.css owned them; review 2026-08-16): */
* { box-sizing: border-box; }
[hidden] { display: none !important; }   /* the attribute must beat any author `display` */

html { scroll-behavior: smooth; }
body.site {
    margin: 0;
    background: var(--al-bg);
    color: var(--al-text);
    font-family: var(--al-font-body);
    font-size: 15px;
    line-height: 1.55;
    text-wrap: pretty;
}
.site a { color: var(--al-accent-700); text-underline-offset: 3px; transition: color .12s, background .12s, border-color .12s; }
.site a:hover { color: var(--al-accent-600); }
.site ::selection { background: rgba(73, 61, 58, 0.3); }
.site :focus { outline: none; }
.site :focus-visible { outline: 2px solid var(--al-accent); outline-offset: 2px; }
.site img { display: block; max-width: 100%; }
.site figure { margin: 0; }
/* (skip-link: the core public-core.css pattern serves as-is — review R6) */

/* ── Shared pieces ───────────────────────────────────────────────────────── */
/* Design geometry, MEASURED on the rendered prototype (1440px): the hero is
   a wider stage (content 1240 @ x=100); every other section — light and the
   full-bleed darks alike — aligns its content to 1096px @ x=172. Under the
   border-box reset this is exactly max-width 1240 WITH the padding inside;
   the content-box era rendered light sections 72px left of the darks. */
.al-wrap { max-width: var(--al-maxw); margin-inline: auto; padding-inline: var(--al-pad); }
.al-hr { height: 1px; border: 0; margin: 0; background: var(--al-divider); }

.al-kicker {
    display: block;
    font-size: 12px; line-height: 14px; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--al-accent-700);
    font-feature-settings: 'tnum' 1;
    margin: 0 0 14px;
}
.al-kicker--dark { color: var(--al-accent-400); }
.al-h2 {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(34px, 3.6vw, 46px); line-height: 1.15;
    letter-spacing: -0.008em; margin: 0;
}
.al-h3 {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: 25px; line-height: 30px; margin: 0;
}
.al-tnum { font-feature-settings: 'tnum' 1; }

/* the one filled element on the page — the shared CTA button */
.al-cta {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    background: var(--al-accent-600); border: 1px solid var(--al-accent-600);
    color: var(--al-bg) !important;
    font-family: var(--al-font-body); font-weight: 600; font-size: 12px;
    letter-spacing: 0.14em; text-transform: uppercase;
    padding: 13px 22px; border-radius: var(--al-radius);
}
.al-cta:hover { background: var(--al-accent-700); border-color: var(--al-accent-700); }

.al-link-sec { font-size: 14.5px; white-space: nowrap; font-feature-settings: 'tnum' 1; }

/* icons — single-colour SVGs consumed as CSS masks (colour = background) */
.al-icon {
    display: block; width: 32px; height: 32px;
    background: var(--al-accent-700);
    -webkit-mask: var(--al-mask) no-repeat center / contain;
    mask: var(--al-mask) no-repeat center / contain;
}
.al-i-court { --al-mask: url('../img/icons/court-building.svg'); }
.al-i-certificate { --al-mask: url('../img/icons/certificate.svg'); }
.al-i-document { --al-mask: url('../img/icons/legal-document.svg'); }
.al-i-attorney { --al-mask: url('../img/icons/attorney.svg'); }
.al-i-scales { --al-mask: url('../img/icons/scales.svg'); }
.al-i-briefcase { --al-mask: url('../img/icons/briefcase.svg'); }
.al-i-advice { --al-mask: url('../img/icons/legal-advice.svg'); }
.al-i-courtroom { --al-mask: url('../img/icons/courtroom.svg'); }

/* photographs go through the plate: warm archival grade in a thin mat */
.al-plate {
    filter: sepia(0.22) saturate(0.82) contrast(1.05);
    box-sizing: border-box;
    border: 6px solid var(--al-surface);
    outline: 1px solid var(--al-divider);
}
.al-plate img { width: 100%; height: auto; object-fit: cover; }

/* full-bleed dark section ground */
.al-dark {
    position: relative; overflow: hidden;
    background: var(--al-dark);
    padding-inline: var(--al-bleed-pad);
}

/* ── Scroll progress thread (header partial) ─────────────────────────────── */
.al-progress {
    position: fixed; inset-block-start: 0; inset-inline-start: 0;
    height: 2px; width: 0%;
    background: var(--al-accent); z-index: 60;
}

/* ── Sticky nav (site-header.php) ────────────────────────────────────────── */
.site-header {
    position: sticky; top: 0; z-index: 40;
    display: flex; align-items: center; gap: 18px;
    background: var(--al-bg);
    padding-block: 18px;
    padding-inline: var(--al-bleed-pad);
    border-bottom: 1px solid var(--al-divider);
}
.site-header .site-brand { display: block; margin-inline-end: auto; }
.site-header .site-brand img { height: 36px; width: auto; display: block; }
.site-header .site-brand span {
    font-family: var(--al-font-heading); font-weight: 400; font-size: 18px;
    color: var(--al-text);
}
.site-header .site-nav { display: flex; align-items: center; gap: 18px; }
.site-header .site-nav a {
    color: inherit; text-decoration: none; font-size: 14px; white-space: nowrap;
}
.site-header .site-nav a:hover { color: var(--al-accent); }

/* language selector — the firm's globe/details pattern in this design's dress */
.site-lang { position: relative; }
.site-lang > summary {
    list-style: none; cursor: pointer;
    display: inline-flex; align-items: center; gap: 7px;
    padding: 9px 12px;
    border: 1px solid var(--al-divider); border-radius: var(--al-radius);
    font-size: 11px; letter-spacing: 0.1em;
    font-feature-settings: 'tnum' 1;
    color: var(--al-text);
    transition: border-color .12s, color .12s;
}
.site-lang > summary::-webkit-details-marker { display: none; }
.site-lang > summary:hover { border-color: var(--al-accent); color: var(--al-accent); }
.site-lang > summary svg { width: 15px; height: 15px; }
.site-lang > summary .chev { width: 10px; height: 10px; transition: transform .12s; }
.site-lang[open] > summary .chev { transform: rotate(180deg); }
.site-lang-panel {
    position: absolute; inset-inline-end: 0; inset-block-start: calc(100% + 6px);
    min-width: 240px; z-index: 60;
    background: var(--al-surface); border: 1px solid var(--al-divider);
    box-shadow: 0 12px 32px rgba(34, 27, 24, 0.22);
    display: grid; grid-template-columns: 1fr 1fr;
}
.site-lang-panel a {
    display: flex; align-items: center; gap: 8px;
    padding: 11px 14px; font-size: 13px;
    color: var(--al-text) !important; text-decoration: none;
    border-block-end: 1px solid var(--al-accent-100);
}
.site-lang-panel a:nth-child(odd) { border-inline-end: 1px solid var(--al-accent-100); }
.site-lang-panel a:last-child,
.site-lang-panel a:nth-last-child(2):nth-child(odd) { border-block-end: 0; }
.site-lang-panel a:hover, .site-lang-panel a.on { background: var(--al-bg); }
.site-lang-panel .c {
    font-size: 10.5px; letter-spacing: 0.08em; inline-size: 22px;
    color: var(--al-accent-400); font-feature-settings: 'tnum' 1;
}

/* ── Hero ────────────────────────────────────────────────────────────────── */
.al-hero {
    position: relative; overflow: hidden;
    padding: clamp(64px, 10vh, 120px) var(--al-pad) 98px;
}
.al-hero-inner { max-width: var(--al-maxw); margin-inline: auto; position: relative; }
.al-hero h1 { margin: 0; font-weight: 400; }
.al-hero-kicker {
    display: block;
    font-family: var(--al-font-body);
    font-size: 12.5px; line-height: 14px; letter-spacing: 0.22em;
    text-transform: uppercase; color: var(--al-accent-700);
    font-feature-settings: 'tnum' 1;
    margin: 0 0 48px;
    animation: alFadeUp .6s ease both;
}
.al-hl {
    display: block;
    font-family: var(--al-font-heading);
    font-size: clamp(36px, 5vw, 66px); line-height: 1.14; letter-spacing: -0.012em;
}
.al-hl-1 { margin-inline-start: -0.042em; animation: alFadeUp .7s ease .08s both; }
.al-hl-2 { padding-inline-start: clamp(20px, 6vw, 96px); animation: alFadeUp .7s ease .16s both; }
.al-hl-3 { padding-inline-start: clamp(40px, 12vw, 192px); animation: alFadeUp .7s ease .24s both; }

.al-hero-below { position: relative; margin-block-start: 56px; }
.al-hero-mark {
    position: absolute; z-index: -1; inset-block-end: 0;
    /* bleeds to the true viewport edge; logical so AR mirrors it */
    inset-inline-end: calc((100% - 100vw) / 2);
    width: clamp(300px, 38vw, 540px); height: auto;
    fill: var(--al-accent); opacity: 0.09; pointer-events: none;
}
.al-standfirst {
    font-size: 16.5px; line-height: 28px; margin: 0; max-width: 56ch;
    color: rgba(38, 32, 29, 0.82);
    animation: alFadeUp .7s ease .36s both;
}
.al-actionbar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 21px 42px; flex-wrap: wrap;
    margin-block-start: 64px; padding-block-start: 21px;
    border-top: 1px solid var(--al-divider);
    animation: alFadeUp .7s ease .46s both;
}
.al-actions { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.al-google {
    font-size: 12.5px; letter-spacing: 0.1em; text-transform: uppercase;
    color: rgba(38, 32, 29, 0.7) !important; text-decoration: none;
    font-feature-settings: 'tnum' 1; white-space: nowrap;
}
.al-google:hover { color: var(--al-accent-700) !important; }
.al-plate--hero { margin: 70px 0 0; animation: alFadeUp .8s ease .54s both; }
.al-plate--hero img { aspect-ratio: 21 / 9; }

/* ── Who we act for ──────────────────────────────────────────────────────── */
.al-who { padding-block: 84px; }
.al-who .al-kicker { margin-block-end: 28px; }
.al-statement {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(27px, 3.4vw, 44px); line-height: 1.4;
    letter-spacing: -0.005em; margin: 0; max-width: 28ch;
}
.al-statement a {
    color: inherit; text-decoration: underline;
    text-decoration-color: var(--al-accent-400);
    text-decoration-thickness: 1px; text-underline-offset: 7px;
    transition: color .2s ease, text-decoration-color .2s ease;
}
.al-statement a:hover { color: var(--al-accent-700); text-decoration-color: var(--al-accent-700); }

/* ── Practice index ──────────────────────────────────────────────────────── */
.al-practice { padding-block: 98px; }
.al-practice-head {
    display: flex; align-items: baseline; justify-content: space-between;
    gap: 28px; flex-wrap: wrap; margin: 0 0 56px;
}
.al-more { font-size: 14.5px; }
.al-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 5fr) minmax(0, 6fr) auto;
    gap: 0 clamp(16px, 3vw, 42px);
    align-items: baseline;
    padding: 28px 8px;
    border-top: 1px solid var(--al-divider);
    color: inherit !important; text-decoration: none;
    transition: background .3s ease, padding .3s ease;
}
.al-row:last-of-type { border-bottom: 1px solid var(--al-divider); }
.al-row:hover { background: rgba(73, 61, 58, 0.06); padding-inline-start: 24px; }
.al-row-num {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: 40px; line-height: 40px; color: var(--al-accent);
    font-feature-settings: 'tnum' 1;
}
.al-row-title {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(26px, 3vw, 36px); line-height: 1.1; letter-spacing: -0.008em;
}
.al-row-desc { font-size: 14.5px; line-height: 23px; color: rgba(38, 32, 29, 0.7); }
.al-row .al-icon { align-self: center; }
.al-also {
    display: flex; align-items: baseline; gap: 21px 28px; flex-wrap: wrap;
    margin-block-start: 42px;
}
.al-also-label {
    font-size: 12px; line-height: 26px; letter-spacing: 0.18em;
    text-transform: uppercase; color: rgba(38, 32, 29, 0.7); white-space: nowrap;
}
.al-tags { display: flex; gap: 10px; flex-wrap: wrap; }
.al-tag {
    display: inline-flex; align-items: center;
    font-size: 11px; letter-spacing: 0.02em; padding: 3px 10px;
    border-radius: 3px; border: 1px solid var(--al-accent);
    color: var(--al-accent) !important; text-decoration: none; white-space: nowrap;
}
.al-tag:hover { background: rgba(73, 61, 58, 0.08); }

/* ── How we work (dark) ──────────────────────────────────────────────────── */
.al-how { padding-block: 98px; }
.al-how .al-h2 { color: var(--al-bg); max-width: 24ch; }
.al-steps {
    display: grid; grid-template-columns: 1fr 1fr 1fr;
    gap: 42px clamp(32px, 5vw, 84px);
    margin-block-start: 70px;
}
.al-step {
    position: relative;
    border-top: 1px solid rgba(244, 241, 238, 0.22);
    padding-block-start: 28px;
}
.al-step-node {
    position: absolute; inset-block-start: -8px; inset-inline-start: 0;
    font-size: 14px; line-height: 16px; color: var(--al-accent-400);
    background: var(--al-dark); padding-inline-end: 10px;
}
.al-step-label {
    display: block;
    font-size: 12px; line-height: 14px; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--al-accent-400);
    font-feature-settings: 'tnum' 1;
}
.al-step .al-icon { width: 34px; height: 34px; margin-block-start: 18px; background: var(--al-accent-400); }
.al-step .al-h3 { margin: 16px 0 0; color: var(--al-bg); }
.al-step p { font-size: 15px; line-height: 26px; color: rgba(244, 241, 238, 0.68); margin: 10px 0 0; }
.al-call-line { margin: 64px 0 0; font-size: 14.5px; line-height: 24px; color: rgba(244, 241, 238, 0.68); }
.al-call-line a { color: var(--al-accent-400) !important; white-space: nowrap; text-decoration: none; font-feature-settings: 'tnum' 1; }

/* ── The firm ────────────────────────────────────────────────────────────── */
.al-firm {
    display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
    gap: 42px clamp(32px, 6vw, 110px);
    align-items: start; padding-block: 98px;
}
.al-firm .al-h2 { margin: 0 0 36px; max-width: 20ch; }
.al-firm-p {
    font-size: 15.5px; line-height: 28px; color: rgba(38, 32, 29, 0.82);
    margin: 0; max-width: 52ch; text-align: justify; hyphens: auto;
}
.al-firm-p + .al-firm-p { margin-block-start: 21px; }
.al-dropcap {
    float: inline-start;
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: 78px; line-height: 56px; color: var(--al-accent-700);
    padding-block-start: 6px; padding-inline-end: 12px;
}
.al-sig {
    font-size: 12px; line-height: 22px; letter-spacing: 0.18em;
    text-transform: uppercase; color: rgba(38, 32, 29, 0.7);
    margin: 36px 0 0; font-feature-settings: 'tnum' 1;
}
.al-firm-more { font-size: 14.5px; line-height: 28px; margin: 14px 0 0; }
.al-plate--portrait { width: 92%; }
.al-plate--portrait img { aspect-ratio: 3 / 2; }
.al-plate--board { width: 62%; margin: 0; margin-block-start: -56px; margin-inline-start: auto; position: relative; }
.al-plate--board img { aspect-ratio: 4 / 3; }
.al-creds {
    grid-column: 1 / -1; margin-block-start: 28px;
    border-top: 1px solid var(--al-divider); padding-block-start: 42px;
}
.al-creds .al-kicker { margin-block-end: 28px; }
.al-creds-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px clamp(32px, 6vw, 110px); }
.al-cred {
    display: flex; gap: 12px; align-items: baseline; margin: 0;
    font-size: 14.5px; line-height: 24px; color: rgba(38, 32, 29, 0.78);
}
.al-cred-mark { color: var(--al-accent); font-size: 11px; }
.al-creds-note {
    font-size: 13px; line-height: 22px; color: rgba(38, 32, 29, 0.7);
    margin: 28px 0 0; font-feature-settings: 'tnum' 1;
}

/* ── Quote interlude / reviews (dark) ────────────────────────────────────── */
.al-reviews { padding-block: 112px; }
.al-ghost-quote {
    position: absolute; inset-block-start: -36px;
    inset-inline-start: var(--al-bleed-pad);
    margin: 0; margin-inline-start: -30px;
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: 380px; line-height: 1;
    color: var(--al-accent-400); opacity: 0.2;
    pointer-events: none; user-select: none;
}
.al-reviews-body { position: relative; }
.al-quote {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(30px, 3.6vw, 46px); line-height: 1.3;
    letter-spacing: -0.005em; max-width: 28ch; margin: 0;
    color: var(--al-bg); text-indent: -0.340em;
}
.al-quote-attr {
    font-size: 12px; line-height: 14px; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--al-accent-400); margin: 42px 0 0;
}
.al-quotes2 {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 28px clamp(32px, 6vw, 110px);
    max-width: 980px; margin-block-start: 70px; padding-block-start: 42px;
    border-top: 1px solid rgba(244, 241, 238, 0.2);
}
.al-quote-sm { font-size: 15px; line-height: 26px; margin: 0; color: rgba(244, 241, 238, 0.72); }
.al-quote-name {
    font-size: 11.5px; line-height: 14px; letter-spacing: 0.18em;
    text-transform: uppercase; color: rgba(244, 241, 238, 0.55); margin: 14px 0 0;
}
.al-reviews-note {
    font-size: 14px; line-height: 24px; margin: 42px 0 0;
    color: rgba(244, 241, 238, 0.55); font-feature-settings: 'tnum' 1;
}

/* ── FAQ ─────────────────────────────────────────────────────────────────── */
.al-faq {
    display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: 42px clamp(32px, 6vw, 110px);
    padding-block: 98px;
}
.al-faq .al-h2 { max-width: 12ch; }
.al-faq-item { border-top: 1px solid var(--al-divider); padding-block: 21px; }
.al-faq-item:last-child { border-bottom: 1px solid var(--al-divider); }
.al-faq-item p { font-size: 15px; line-height: 26px; color: rgba(38, 32, 29, 0.75); margin: 10px 0 0; max-width: 60ch; }

/* ── Colophon / contact (site-footer.php, dark) ──────────────────────────── */
.al-colophon { padding-block: 112px 48px; }
.al-ghost-year {
    position: absolute; inset-inline-end: 0; inset-block-start: 28px; margin: 0;
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(180px, 24vw, 320px); line-height: 1;
    color: var(--al-accent-400); opacity: 0.16;
    font-feature-settings: 'tnum' 1;
    pointer-events: none; user-select: none;
}
.al-colophon-body { position: relative; }
.al-colophon .al-kicker--dark { margin: 0 0 21px; }
.al-colophon-h2 {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(38px, 5vw, 64px); line-height: 1.1;
    letter-spacing: -0.01em; margin: 0; color: var(--al-bg); max-width: 20ch;
}
.al-colophon-p {
    font-size: 16px; line-height: 28px; color: rgba(244, 241, 238, 0.72);
    margin: 28px 0 0; max-width: 56ch;
}
.al-colophon .al-actions { margin-block-start: 36px; }
.al-link-dim { font-size: 14.5px; white-space: nowrap; color: rgba(244, 241, 238, 0.8) !important; font-feature-settings: 'tnum' 1; }
.al-offices {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 28px clamp(32px, 6vw, 110px);
    max-width: 820px; margin-block-start: 84px; padding-block-start: 42px;
    border-top: 1px solid rgba(244, 241, 238, 0.2);
}
.al-office-label {
    font-size: 12px; line-height: 14px; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--al-accent-400); margin: 0 0 14px;
}
.al-office-addr {
    font-size: 14.5px; line-height: 25px; color: rgba(244, 241, 238, 0.72);
    margin: 0; font-feature-settings: 'tnum' 1;
}
.al-office-addr a { color: inherit !important; text-decoration: none; }
.al-office-addr a.al-maps { color: var(--al-accent-400) !important; text-decoration: underline; text-underline-offset: 3px; }
.al-footrule {
    display: flex; flex-wrap: wrap; gap: 8px 42px; justify-content: space-between;
    margin-block-start: 56px; padding-block-start: 21px;
    border-top: 1px solid rgba(244, 241, 238, 0.2);
    font-size: 12px; line-height: 20px; letter-spacing: 0.04em;
    color: rgba(244, 241, 238, 0.55);
}
.al-footrule-links { display: flex; gap: 28px; }
.al-footrule a { color: rgba(244, 241, 238, 0.72) !important; text-decoration: none; }
.al-footrule a:hover { color: var(--al-bg) !important; }

/* ── Plain pages (privacy / terms / cookies) — inner pages wear the same
      dress: Marcellus headings, hairline rules, the landing's measure ────── */
.entry {
    max-width: calc(760px + 2 * var(--al-pad));   /* border-box: 760px of content */
    margin-inline: auto;
    padding: clamp(56px, 8vh, 84px) var(--al-pad) 98px;
}
.entry h1 {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: clamp(34px, 3.6vw, 46px); line-height: 1.15;
    letter-spacing: -0.008em; margin: 0 0 28px;
    padding-block-end: 28px; border-bottom: 1px solid var(--al-divider);
}
.entry h2 {
    font-family: var(--al-font-heading); font-weight: 400;
    font-size: 25px; line-height: 30px; margin: 42px 0 0;
    padding-block-start: 21px; border-top: 1px solid var(--al-divider);
}
.entry p, .entry li {
    font-size: 15px; line-height: 26px; color: rgba(38, 32, 29, 0.82);
    margin: 10px 0 0; max-width: 65ch;
}
.entry ul, .entry ol { margin: 10px 0 0; padding-inline-start: 22px; }
.entry em { font-size: 13px; color: rgba(38, 32, 29, 0.7); }

/* ── Cookie banner (ships with Analytics; consent.js drives visibility) ──── */
.cookie-consent {
    position: fixed; z-index: 80;
    inset-inline-start: 16px; inset-block-end: 16px;
    max-width: 380px;
    background: var(--al-surface); color: var(--al-text);
    border: 1px solid var(--al-divider); border-radius: var(--al-radius);
    padding: 18px 20px;
    box-shadow: 0 12px 32px rgba(34, 27, 24, 0.22);
    font-size: 13.5px;
}
.cookie-consent[hidden] { display: none; }
.cookie-consent__text { margin: 0 0 12px; line-height: 1.55; }
.cookie-consent__text a { color: var(--al-accent-700); }
.cookie-consent__actions { display: flex; gap: 8px; }
.cookie-consent__accept, .cookie-consent__decline {
    cursor: pointer;
    font-family: var(--al-font-body); font-weight: 600; font-size: 11px;
    letter-spacing: 0.14em; text-transform: uppercase;
    padding: 9px 16px; border-radius: var(--al-radius);
    transition: color .12s, background .12s, border-color .12s;
}
.cookie-consent__accept {
    border: 1px solid var(--al-accent-600); background: var(--al-accent-600);
    color: var(--al-bg);
}
.cookie-consent__accept:hover { background: var(--al-accent-700); border-color: var(--al-accent-700); }
.cookie-consent__decline {
    border: 1px solid var(--al-accent-300); background: transparent;
    color: rgba(38, 32, 29, 0.7);
}
.cookie-consent__decline:hover { color: var(--al-accent-700); border-color: var(--al-accent-700); }

/* ── Motion ──────────────────────────────────────────────────────────────── */
@keyframes alFadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: none; }
}

/* ── Responsive — the design's two breakpoints ───────────────────────────── */
@media (max-width: 780px) {
    .al-row { grid-template-columns: 44px minmax(0, 1fr) 24px; row-gap: 6px; }
    .al-row-num { font-size: 26px; line-height: 30px; }
    .al-row-desc { grid-column: 2 / 4; grid-row: 2; }
    .al-hero-mark { display: none; }
    .al-steps, .al-firm, .al-creds-grid, .al-quotes2, .al-faq, .al-offices { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    /* phones: logo · selector on the first row, the CTA full-width below —
       the RU/FR labels overflow a single row (measured 443px/407px @390;
       review 2026-08-16), and the selector must survive: it is how a
       visitor reaches their language */
    .site-header { flex-wrap: wrap; row-gap: 12px; }
    .site-header .site-nav { display: none; }
    .site-lang { margin-inline-start: auto; }
    .site-header .al-cta { flex: 1 1 100%; justify-content: center; }
    .site-lang-panel { min-width: 210px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .site *, .site *::before, .site *::after { animation: none !important; }
}
