/* Aletheia — inner pages. Builds on site.css (tokens, nav, start/footer). */

.page main { overflow-x: clip; }

/* ───────────── page hero ───────────── */
.phero { position: relative; min-height: 80vh; min-height: 80svh; display: grid; align-content: end; gap: 1.6rem; padding: 9rem var(--pad) calc(4rem + var(--sheet)); background: var(--bg, var(--paper)); color: var(--fg, var(--ink)); }
.phero h1 { font-size: clamp(2.9rem, 9.2vw, 10.5rem); font-stretch: 78%; line-height: .88; letter-spacing: -.035em; max-width: 11em; }
.phero h1 em { color: var(--em, var(--cobalt)); font-weight: 360; }
.phero h1 .line { display: block; }
.phero__lede { max-width: 42ch; font-size: clamp(1.1rem, 1.7vw, 1.6rem); line-height: 1.3; font-weight: 500; }
.phero--cobalt { --bg: var(--cobalt); --fg: var(--paper); --em: var(--marigold); }
.phero--night { --bg: var(--night); --fg: var(--paper); --em: var(--marigold); }
.phero--marigold { --bg: var(--marigold); --em: var(--ink); }
.phero--short { min-height: 62vh; min-height: 62svh; }

/* ───────────── sheets ───────────── */
.sheet { position: relative; z-index: 2; border-radius: var(--sheet) var(--sheet) 0 0; margin-top: calc(var(--sheet) * -1); padding: clamp(4.5rem, 13vh, 10rem) var(--pad) calc(clamp(4.5rem, 13vh, 10rem) + var(--sheet)); background: var(--bg, var(--paper)); color: var(--fg, var(--ink)); display: grid; gap: 2.4rem; }
.sheet--night { --bg: var(--night); --fg: var(--paper); --em: var(--marigold); }
.sheet--paper2 { --bg: var(--paper-2); }
.sheet--blush { --bg: var(--blush); }
.sheet--lilac { --bg: var(--lilac); }
.sheet--mint { --bg: var(--mint); }
.big { font-size: clamp(2rem, 5.6vw, 6rem); font-stretch: 80%; line-height: .94; letter-spacing: -.035em; max-width: 15em; }
.big em, .sheet h2 em { color: var(--em, var(--cobalt)); font-weight: 360; }
.cols { display: grid; grid-template-columns: repeat(2, minmax(0, 34rem)); gap: 2rem 5vw; font-size: clamp(1.05rem, 1.5vw, 1.4rem); }
.cols .strong { font-weight: 700; }
.aside { color: var(--ink-2); }
.aside a, .prose a { border-bottom: 1.5px solid currentColor; }

.btn--ink { background: var(--ink); color: var(--paper); width: fit-content; }
.btn--ink i { background: var(--paper); color: var(--ink); }
.btn--ink:hover { background: var(--cobalt); color: var(--paper); }

/* ───────────── about ───────────── */
.values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.8rem, 1.6vw, 1.6rem); }
.value { padding: 1.4rem 1.4rem 1.8rem; border-radius: clamp(16px, 1.6vw, 26px); background: var(--paper-2); display: grid; gap: .8rem; align-content: start; transition: rotate .6s var(--ease), translate .6s var(--ease); }
.value:nth-child(odd) { rotate: -1.6deg; }
.value:nth-child(even) { rotate: 1.4deg; translate: 0 1.6rem; }
.value:nth-child(2) { background: var(--cobalt); color: var(--paper); }
.value:nth-child(3) { background: var(--marigold); }
.value:nth-child(4) { background: var(--night); color: var(--paper); }
.value:hover { rotate: 0deg; translate: 0 -.4rem; }
.value span { font-family: var(--f-m); font-size: .74rem; }
.value h3 { font-size: clamp(1.7rem, 2.6vw, 2.8rem); font-stretch: 82%; line-height: .96; letter-spacing: -.03em; }
.value p { font-size: 1rem; opacity: .85; }

.founder { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 6vw; align-items: center; }
.founder__pic { rotate: -2.5deg; border-radius: clamp(14px, 1.6vw, 26px); overflow: hidden; box-shadow: 0 50px 90px -40px rgba(22, 19, 14, .6); max-width: 30rem; }
.founder__pic img { width: 100%; }
.founder__txt { display: grid; gap: 1.3rem; }
.founder__txt h2 { font-size: clamp(1.9rem, 4.2vw, 4.4rem); font-stretch: 80%; line-height: .94; letter-spacing: -.035em; }
.founder__txt p { max-width: 46ch; }
.links { display: flex; gap: 1.4rem; font-weight: 700; }
.links a { border-bottom: 2px solid currentColor; }

/* ───────────── careers ───────────── */
.roles { border-top: 2px solid var(--ink); }
.role { border-bottom: 2px solid var(--ink); }
.role summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) auto; gap: 1rem 2rem; align-items: center; padding: 1.5rem 0; font-family: var(--f-m); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.role__meta { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
.role__meta span { padding: .25rem .7rem; border-radius: 99px; border: 1.5px solid var(--ink); white-space: nowrap; }
.role__meta span:first-child { background: var(--ink); color: var(--paper); }
.role summary::-webkit-details-marker { display: none; }
.role summary h3 { font-family: var(--f-d); text-transform: none; font-size: clamp(1.6rem, 3.4vw, 3.4rem); font-stretch: 80%; letter-spacing: -.035em; line-height: 1; transition: translate .5s var(--ease), color .5s var(--ease); }
.role summary:hover h3 { translate: .25em 0; color: var(--cobalt); }
.role summary i { font-style: normal; font-size: 1.8rem; font-family: var(--f-d); width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: var(--paper); transition: rotate .5s var(--ease), background .5s var(--ease); }
.role[open] summary i { rotate: 45deg; background: var(--sindoor); }
.role__body { display: grid; gap: 1.8rem; padding: .4rem 0 2.6rem; }
.role__lede { max-width: 62ch; font-size: clamp(1.05rem, 1.35vw, 1.3rem); }
.role__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 5vw; }
.role__cols h4, h2.eyebrow { font-family: var(--f-m); font-size: .74rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .9rem; }
.role__note { max-width: 70ch; padding: 1.1rem 1.3rem; border-radius: 16px; background: var(--paper-2); }
.role__body ul { display: grid; gap: .5rem; }
.role__body li { position: relative; padding-left: 1.4rem; }
.role__body li::before { content: ""; position: absolute; left: 0; top: .55em; width: .5rem; height: .5rem; background: var(--marigold); rotate: 45deg; }

/* ───────────── blog ───────────── */
.filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.filters button { font: inherit; font-weight: 600; font-size: .92rem; padding: .5rem 1rem; border-radius: 99px; border: 1.5px solid var(--ink); background: none; color: var(--ink); cursor: pointer; transition: background .3s var(--ease), color .3s var(--ease); }
.filters button.is-on, .filters button:hover { background: var(--ink); color: var(--paper); }
.posts { border-top: 2px solid var(--ink); }
.post { display: grid; grid-template-columns: 11rem minmax(0, 1.25fr) minmax(0, 1fr) auto; gap: 1.2rem 2.4rem; align-items: start; padding: 1.7rem 0; border-bottom: 1.5px solid rgba(22, 19, 14, .25); transition: padding .5s var(--ease), background .5s var(--ease); }
.post[hidden] { display: none; }
.post:hover { padding-left: 1rem; padding-right: 1rem; background: var(--paper); }
.post__meta { display: grid; gap: .5rem; font-family: var(--f-m); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
.post__meta b { width: fit-content; padding: .15rem .6rem; border-radius: 99px; background: var(--ink); color: var(--paper); font-weight: 500; }
.post h2 { font-size: clamp(1.4rem, 2.3vw, 2.4rem); font-stretch: 84%; line-height: 1; letter-spacing: -.03em; }
.post p { font-size: .98rem; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.post__read { font-family: var(--f-m); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.post__read i { font-style: normal; display: inline-block; transition: translate .4s var(--ease); }
.post:hover .post__read i { translate: .35rem 0; }

.article { padding: 9rem var(--pad) calc(6rem + var(--sheet)); display: grid; gap: 1.6rem; max-width: 64rem; margin: 0 auto; }
.back { font-weight: 700; width: fit-content; border-bottom: 2px solid currentColor; }
.article h1 { font-size: clamp(2.4rem, 6vw, 5.8rem); font-stretch: 80%; line-height: .94; letter-spacing: -.035em; }
.article__lede { font-size: clamp(1.2rem, 1.9vw, 1.7rem); line-height: 1.3; font-weight: 500; max-width: 38em; }
.prose { display: grid; gap: 1.25em; max-width: 44rem; font-size: clamp(1.05rem, 1.25vw, 1.22rem); line-height: 1.62; }
.prose h2 { font-size: clamp(1.5rem, 2.4vw, 2.2rem); font-stretch: 84%; letter-spacing: -.03em; line-height: 1.05; margin-top: 1.2em; }
.article .prose { margin-top: 1.4rem; padding-top: 2rem; border-top: 2px solid var(--ink); }
.article__by { font-family: var(--f-m); font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; }
.article__by a { border-bottom: 1.5px solid currentColor; }
.next { margin-top: 2rem; padding: 1.6rem; border-radius: clamp(16px, 1.6vw, 26px); background: var(--night); color: var(--paper); display: grid; grid-template-columns: 1fr auto; gap: .4rem 2rem; align-items: end; rotate: -.8deg; transition: rotate .5s var(--ease), background .5s var(--ease); }
.next:hover { rotate: 0deg; background: var(--cobalt); }
.next span { grid-column: 1 / -1; font-family: var(--f-m); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.next b { font-size: clamp(1.4rem, 2.6vw, 2.6rem); font-stretch: 82%; letter-spacing: -.03em; line-height: 1; }
.next i { font-style: normal; font-size: 2rem; }

/* ───────────── case studies ───────────── */
.case { gap: 3rem; }
.case__head { display: grid; gap: 1rem; position: relative; }
.case__n { font-size: clamp(4rem, 12vw, 13rem); font-weight: 800; font-stretch: 75%; line-height: .78; letter-spacing: -.05em; opacity: .16; }
.case__head h2 { font-size: clamp(2.1rem, 5.6vw, 6rem); font-stretch: 80%; line-height: .92; letter-spacing: -.035em; max-width: 14em; }
.case__client { font-weight: 700; font-size: 1.15rem; }
.case__shot { border-radius: clamp(12px, 1.3vw, 22px); overflow: hidden; box-shadow: 0 50px 90px -44px rgba(22, 19, 14, .6); rotate: -1deg; max-width: 78rem; background: var(--ink); }
.case__shot img { width: 100%; }
.case__shot pre { padding: clamp(1.2rem, 3vw, 3rem); color: #e8e2d4; font-family: var(--f-m); font-size: clamp(.8rem, 1.3vw, 1.3rem); line-height: 1.7; white-space: pre; overflow: auto; }
.case__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 6vw; }
.case h3 { font-family: var(--f-m); font-size: .74rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .8rem; }
.case__phases { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; counter-reset: ph; }
.case__phases li { counter-increment: ph; padding: 1.2rem; border-radius: 18px; background: rgba(255, 255, 255, .5); display: grid; gap: .5rem; align-content: start; font-size: .95rem; }
.case__phases li::before { content: "0" counter(ph); font-family: var(--f-m); font-size: .72rem; }
.case__phases b { font-size: 1.15rem; letter-spacing: -.01em; }
.case__results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; padding-top: 2rem; border-top: 2px solid var(--ink); }
.case__results b { display: block; font-size: clamp(1.7rem, 3.4vw, 3.6rem); font-stretch: 78%; letter-spacing: -.035em; line-height: 1; }
.case__results span { font-size: .95rem; opacity: .8; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chips span { font-family: var(--f-m); font-size: .72rem; padding: .25rem .7rem; border-radius: 99px; border: 1.5px solid var(--ink); }

/* ───────────── talks ───────────── */
.topics { border-top: 1.5px solid rgba(245, 240, 230, .3); }
.topics li { display: grid; grid-template-columns: 4rem minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1.4rem 0; border-bottom: 1.5px solid rgba(245, 240, 230, .3); transition: padding .5s var(--ease); }
.topics li:hover { padding-left: 1rem; }
.topics span { font-family: var(--f-m); font-size: .76rem; opacity: .7; }
.topics h3 { font-size: clamp(1.5rem, 3.2vw, 3.2rem); font-stretch: 80%; letter-spacing: -.035em; line-height: 1; }
.topics b { font-family: var(--f-m); font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; padding: .25rem .7rem; border-radius: 99px; background: var(--marigold); color: var(--ink); }

/* ───────────── legal ───────────── */
.draft { width: fit-content; font-family: var(--f-m); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; padding: .3rem .8rem; border-radius: 99px; background: var(--sindoor); color: #fff; rotate: -1.5deg; }
.legal .cookie__row--page button[data-cookie="decline"] { background: var(--ink); color: var(--paper); }
.choice b { padding: .1rem .5rem; border-radius: 6px; background: var(--marigold); }
.table { display: grid; border-top: 2px solid var(--ink); font-size: .95rem; }
.table > div { display: grid; grid-template-columns: 1.2fr 1fr 2fr .8fr; gap: 1rem; padding: .9rem 0; border-bottom: 1.5px solid rgba(22, 19, 14, .25); }
.table b { font-family: var(--f-m); font-size: .82rem; word-break: break-all; }

@media (max-width: 820px) {
  .phero { padding-top: 7.5rem; min-height: 70svh; }
  .cols, .founder, .case__grid { grid-template-columns: 1fr; }
  .values { grid-template-columns: 1fr 1fr; }
  .value:nth-child(even) { translate: 0 1rem; }
  .post { grid-template-columns: 1fr; gap: .7rem; }
  .case__results { grid-template-columns: 1fr 1fr; }
  .table > div { grid-template-columns: 1fr 1fr; }
  .topics li { grid-template-columns: 2.4rem minmax(0, 1fr); }
  .topics b { grid-column: 2; width: fit-content; }
}

@media (prefers-reduced-motion: reduce) {
  .value, .founder__pic, .case__shot, .next { rotate: 0deg; }
}

/* ───────────── forms (contact, applications) ───────────── */
.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem 2.4rem; max-width: 62rem; }
.field { display: grid; gap: .45rem; align-content: start; }
.field--full, .form__end { grid-column: 1 / -1; }
.field label { font-family: var(--f-m); font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; opacity: .8; }
.field label i { font-style: normal; opacity: .6; margin-left: .5em; text-transform: none; letter-spacing: 0; }
.field input, .field select, .field textarea { width: 100%; font: inherit; font-size: clamp(1.1rem, 1.5vw, 1.4rem); font-weight: 500; color: inherit; background: none; border: 0; border-bottom: 2px solid currentColor; border-radius: 0; padding: .55rem 0 .65rem; outline: none; transition: border-color .3s var(--ease); }
.field textarea { resize: vertical; min-height: 8rem; }
.field select { appearance: none; cursor: pointer; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23f5f0e6' stroke-width='2'/%3E%3C/svg%3E") right .2rem center / .8rem no-repeat; padding-right: 1.6rem; }
.field select option { color: var(--ink); }
.field input::placeholder { color: inherit; opacity: .4; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--marigold); }
.field.is-bad input, .field.is-bad select, .field.is-bad textarea { border-color: var(--sindoor); }
.field .err { font-size: .85rem; color: #ff9d8a; }
.hp { position: absolute; left: -200vw; opacity: 0; }
.form__end { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.6rem; padding-top: .6rem; }
.form__end .btn { border: 0; cursor: pointer; font-family: inherit; }
.form.is-busy .btn { opacity: .6; pointer-events: none; }
.form__status { font-weight: 600; max-width: 34ch; }
.form__status.is-ok { color: var(--marigold); }
.form__status.is-bad { color: #ff9d8a; }
.form__status a { border-bottom: 1.5px solid currentColor; }

.contact { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, .8fr); gap: 3rem 4vw; align-items: start; }

/* the brief: a paper sheet lifted off the night, with boxed fields and chips for the service */
.brief { counter-reset: f; max-width: none; gap: 1.5rem 1.6rem; padding: clamp(1.4rem, 3.2vw, 3.2rem); border-radius: clamp(18px, 2vw, 30px); background: var(--paper); color: var(--ink); box-shadow: 0 50px 90px -50px rgba(0, 0, 0, .7); }
.brief__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1.5rem; padding-bottom: 1.1rem; border-bottom: 1.5px solid rgba(22, 19, 14, .12); color: var(--ink-2); font-size: .95rem; }
.brief__h .eyebrow { color: var(--ink); }
.brief .field { counter-increment: f; gap: .6rem; }
.brief .field > label, .field__l { font-family: var(--f-m); font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; opacity: 1; color: var(--ink-2); }
.brief .field > label::before, .field__l::before { content: counter(f, decimal-leading-zero); margin-right: .8em; color: var(--cobalt); font-weight: 600; }
.brief .field input:not([type="radio"]), .brief .field textarea { font-size: clamp(1rem, 1.25vw, 1.15rem); padding: .9rem 1rem; border: 1.5px solid transparent; border-radius: 12px; background: rgba(22, 19, 14, .055); transition: border-color .3s var(--ease), background-color .3s var(--ease), box-shadow .3s var(--ease); }
.brief .field textarea { min-height: 9rem; line-height: 1.45; }
.brief .field textarea::placeholder { color: inherit; opacity: .45; font-weight: 400; }
.brief .field input:not([type="radio"]):hover, .brief .field textarea:hover { background: rgba(22, 19, 14, .08); }
.brief .field input:not([type="radio"]):focus, .brief .field textarea:focus { background: #fff; border-color: var(--cobalt); box-shadow: 0 0 0 4px rgba(39, 71, 255, .14); }
.brief .field.is-bad input:not([type="radio"]), .brief .field.is-bad textarea { border-color: var(--sindoor); background: rgba(242, 75, 42, .06); }
.brief__opts { display: flex; flex-wrap: wrap; gap: .55rem; }
.field .brief__opt { position: relative; cursor: pointer; font-family: inherit; text-transform: none; letter-spacing: 0; opacity: 1; }
.brief__opt input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.brief__opt span { display: block; padding: .62rem 1.05rem; border-radius: 99px; border: 1.5px solid rgba(22, 19, 14, .2); font-size: .98rem; font-weight: 600; line-height: 1.2; transition: background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), rotate .4s var(--ease); }
.brief__opt:hover span { border-color: var(--ink); rotate: -1.5deg; }
.brief__opt input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.brief__opt input:focus-visible + span { box-shadow: 0 0 0 4px rgba(39, 71, 255, .25); border-color: var(--cobalt); }
.field.is-bad .brief__opt span { border-color: var(--sindoor); }
.brief .form__end { padding-top: .4rem; }
.brief .form__status.is-ok { color: var(--leaf); }
.brief .form__status.is-bad { color: var(--sindoor); }

.contact__side { display: grid; gap: 1.4rem; position: sticky; top: 6.5rem; }
.contact__next { padding: 1.7rem 1.6rem 1.5rem; border-radius: clamp(16px, 1.6vw, 26px); background: var(--cobalt); color: var(--paper); rotate: 1.2deg; }
.contact__next h2, .contact__info h2 { font-family: var(--f-m); font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; opacity: .75; }
.contact__next ol { list-style: none; counter-reset: n; display: grid; gap: 1.15rem; margin-top: 1.2rem; }
.contact__next li { counter-increment: n; display: grid; grid-template-columns: 2.1rem 1fr; column-gap: .5rem; }
.contact__next li::before { content: counter(n); grid-row: span 2; font-family: var(--f-s); font-style: italic; font-size: 2.1rem; line-height: .95; color: var(--marigold); }
.contact__next b { font-size: 1.12rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; }
.contact__next span { font-size: .95rem; line-height: 1.4; opacity: .85; }
.contact__info { display: grid; gap: 1.5rem; padding: 1.6rem; border-radius: clamp(16px, 1.6vw, 26px); background: rgba(255, 255, 255, .07); rotate: -.8deg; }
.contact__info h2 { margin-bottom: .45rem; opacity: .65; }
.contact__info a, .contact__info p { display: block; font-size: 1.15rem; font-weight: 600; line-height: 1.5; }
.contact__info a:hover { color: var(--marigold); }
.contact__info .clock { font-family: var(--f-m); font-size: .8rem; font-weight: 500; opacity: .7; margin-top: .2rem; }
.contact__info .clock::before { content: ""; display: inline-block; width: .5em; height: .5em; margin-right: .6em; border-radius: 50%; background: var(--marigold); vertical-align: .08em; }
.contact__links { display: flex !important; flex-wrap: wrap; gap: .2rem 1.2rem; }

@media (max-width: 820px) {
  .form, .contact, .role__cols { grid-template-columns: 1fr; }
  .contact__side { position: static; }
  .contact__next, .contact__info { rotate: none; }
  .role summary { grid-template-columns: 1fr auto; }
  .role__meta { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
}

/* ───────────── services, products, industries ───────────── */
h2.eyebrow { font-weight: 500; letter-spacing: .04em; }
.values--auto { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.values--auto .value:nth-child(5) { background: var(--sindoor); color: #fff; }
.values--auto .value:nth-child(6) { background: var(--leaf); color: #fff; }
.svc { grid-template-columns: 13rem minmax(0, 1fr) minmax(0, 1.3fr) auto; }
.ticks { display: grid; gap: .55rem; }
.ticks li { position: relative; padding-left: 1.4rem; }
.ticks li::before { content: ""; position: absolute; left: 0; top: .55em; width: .5rem; height: .5rem; background: var(--marigold); rotate: 45deg; }
.case__head a { transition: color .4s var(--ease); }
.case__head a:hover { color: var(--cobalt); }
.topics h3 a:hover { color: var(--marigold); }
.faq summary { grid-template-columns: minmax(0, 1fr) auto; }
.faq summary h3 { font-size: clamp(1.3rem, 2.4vw, 2.3rem); }
.pricing { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: clamp(.8rem, 1.6vw, 1.6rem); align-items: start; }
.tier { display: grid; gap: 1rem; padding: 1.5rem; border-radius: clamp(16px, 1.6vw, 26px); background: rgba(255, 255, 255, .07); }
.tier--on { background: var(--paper); color: var(--ink); rotate: -1deg; }
.tier h3 { font-family: var(--f-m); font-size: .76rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; }
.tier__price { font-size: clamp(2rem, 3.4vw, 3.4rem); font-weight: 800; font-stretch: 78%; letter-spacing: -.035em; line-height: 1; }
.tier .btn { width: fit-content; padding: .8rem 1rem .8rem 1.3rem; font-size: 1rem; }
.tier:not(.tier--on) .btn { background: var(--marigold); }
.related { display: grid; gap: .6rem; padding-top: 1.6rem; border-top: 2px solid var(--ink); }
.related h2 { font-family: var(--f-m); font-size: .74rem; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; }
.related a { font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; width: fit-content; border-bottom: 2px solid transparent; }
.related a:hover { border-color: currentColor; }
@media (max-width: 820px) { .svc { grid-template-columns: 1fr; } }

.article__cta { max-width: 44rem; padding: 1.1rem 1.3rem; border-radius: 16px; background: var(--paper-2); font-weight: 500; }
.article__cta a { border-bottom: 1.5px solid currentColor; font-weight: 700; }