/* company.css: about, contact and privacy (pages_company.py), round-2 rework, 25 Oct 2026.
   Loaded after tokens.css and inner.css on these three pages only. */

/* ---------- about: the title card ---------- */
.ab-hero { grid-template-areas: "top fig" "ans fig"; grid-template-rows: auto auto; row-gap: 0; align-items: start; padding-bottom: clamp(40px, 4.4vw, 68px); }
.ab-hero .tc-top { grid-area: top; align-self: end; }
.ab-hero .tc-r { grid-area: fig; align-self: center; }
.ab-hero .tc-ans { grid-area: ans; }
.ab-hero .tc-ans .ip-answer { margin-top: 26px; max-width: 44rem; }
.tc-upd { margin: 20px 0 0; font-family: var(--f-m); font-size: var(--fs-lab); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
@media (max-width: 1080px) {
  .ab-hero { grid-template-areas: "top" "fig" "ans"; grid-template-columns: minmax(0, 1fr); }
  .ab-hero .tc-r { margin-top: 28px; padding: 26px 20px; }
  .ab-hero .plate-xl img { width: clamp(180px, 46vw, 260px); }
}

/* about: chapters */
.ab .ab-still { margin-top: 36px; }
.rec-foot { margin: 16px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--body); }
.ab-chip { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; column-gap: 16px; font-family: var(--f-d); font-style: normal; }
.ab-chip .gc-t b { display: block; font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--text); }
.ab-chip .gc-t span { display: block; margin-top: 4px; font-family: var(--f-s); font-style: italic; font-size: 17px; line-height: 1.3; color: var(--warm); }
.ab-chip > svg { margin-top: 5px; }
.ab-stages { list-style: none; margin: 4px 0 26px; padding: 0; border-top: 1px solid var(--rule); }
.ab-stages li { display: grid; grid-template-columns: 30px 22px minmax(0, 1fr); column-gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line-2); font-size: 15.5px; line-height: 1.45; color: var(--text); }
.ab-stages i { font-style: normal; font-family: var(--f-m); font-size: var(--fs-lab); letter-spacing: .1em; color: var(--mute); }
.ab-stages .ic { width: 20px; height: 20px; }
.ab-film { align-items: start; }
.ab-film .ab-still2 { margin-top: 6px; }
.prose .ab-tag { margin-bottom: .5em; font-family: var(--f-s); font-style: italic; font-size: clamp(24px, 2vw, 32px); line-height: 1.3; color: var(--warm); }
.ab-tag i { font-style: normal; color: var(--mute); }
.ab-status li { gap: 20px; }
.ab-status b { text-align: left; }
.ab-status b a { color: var(--text); border-bottom: 1px solid var(--ember); }
.ab-status .slot.is-pend { flex: none; }
.ab-status .slot.is-pend::before { content: none; }
/* about route on phones: the hub stacks, each connector points down into the next cell */
@media (max-width: 900px) {
  .ab-route .r-mid { flex-direction: column; align-items: center; gap: 4px; padding: 34px 20px; text-align: center; }
  .ab-route .r-hub, .ab-route .r-loop { margin: 0; text-align: center; }
  .ab-route .r-loop { margin-top: 6px; }
  .ab-route .r-arrow::after { left: 50%; right: auto; top: auto; bottom: 0; margin-left: -5.5px; transform: rotate(135deg); }
}

/* ---------- contact: the doors land in the first screen ---------- */
@media (min-width: 1081px) { .ip-contact .dh-top { grid-template-columns: minmax(0, 1.25fr) minmax(0, 34rem); } }
@media (max-width: 1080px) { .ip-contact .dh-top { grid-template-columns: minmax(0, 1fr); } .ip-contact .dh-top .ip-lede { margin-top: 18px; } }
.ip-contact .dh-top { padding-top: clamp(28px, 3.8vw, 56px); padding-bottom: clamp(26px, 3vw, 44px); }
.ip-contact .dh-top .ip-h1 { font-size: clamp(44px, 4.6vw, 78px); }
.ip-contact .dh-top .ip-lede { max-width: 40rem; }
.ip-contact .dd { min-height: clamp(340px, 48vh, 540px); padding-top: max(clamp(24px, 4vw, 60px), 68px); }
@media (max-width: 760px) {
  .ip-contact .dh-top { padding-top: 26px; padding-bottom: 22px; }
  .ip-contact .dh-top .ip-h1 { font-size: clamp(36px, 10vw, 44px); }
  .ip-contact .dh-top .ip-lede { margin-top: 14px; font-size: 16.5px; line-height: 1.55; }
  /* critical pass 25 Oct: the top padding clears the image tag (top 16px + about 26px tall) by 26px on both doors */
  .ip-contact .dd { min-height: 290px; padding: 68px var(--gut) 24px; }
  .ip-contact .dd .dd-t { font-size: 46px; }
  .ip-contact .dd-p { margin: 10px 0 18px; font-size: 15px; }
}
/* critical pass 25 Oct: the form's placeholder and field lines pass WCAG AA on this page (--mute 7:1, --rule 3.1:1) */
.ip-contact .enq-f .f input::placeholder, .ip-contact .enq-f .f textarea::placeholder { color: var(--mute); }
.ip-contact .enq-f .f input, .ip-contact .enq-f .f textarea { border-bottom-color: var(--rule); }
.ip-contact .enq-f .f input:focus, .ip-contact .enq-f .f textarea:focus, .ip-contact .enq-f .f input[aria-invalid="true"] { border-color: var(--ember); }
.enq2-sub { margin: 0 0 34px; max-width: 34rem; font-size: 15.5px; line-height: 1.6; color: var(--body); }
.enq2-sub a, .ip-contact .checks span a, .next-p a { color: var(--text); border-bottom: 1px solid var(--ember); }
.ip-contact h3.tell-h { font-weight: 500; line-height: 1.45; letter-spacing: .12em; }
/* phones and tablets: what to send comes before the form */
@media (max-width: 1080px) {
  .enq2 { grid-template-areas: "head" "left" "form"; }
  .enq2-l { margin-bottom: 44px; }
  .enq2-r { margin-bottom: 0; }
}
.ip-contact .steps { margin-top: 34px; }
.ip-contact .steps span { max-width: none; }
.next-p { max-width: var(--measure); margin: 40px 0 0; font-size: var(--fs-body); line-height: 1.7; color: var(--body); }
.co-l { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 28px; margin-top: 60px; }
.co-l > div { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 6px; }
.co-l dd { text-align: left; }
.co-l em { font-family: var(--f-s); font-size: 18px; color: var(--warm); }
.co-l a { color: var(--text); border-bottom: 1px solid var(--ember); }
@media (max-width: 900px) {
  .co-l { grid-template-columns: minmax(0, 1fr); }
  .co-l > div { flex-direction: row; align-items: baseline; justify-content: space-between; }
  .co-l dd { text-align: right; }
}

/* ---------- privacy: the sheet runs to the container edge, text kept to the measure ---------- */
@media (min-width: 1081px) { .ip-legal .p-wrap { grid-template-columns: var(--rail-w) minmax(0, 1fr); } }
.ip-legal .p-idx a { align-items: center; }
.p-idx .ic { width: 16px; height: 16px; stroke: var(--mute); }
.p-idx a.on .ic, .p-idx a:hover .ic { stroke: var(--text); }
.ip-legal .sheet::after { background: linear-gradient(160deg, rgba(255, 255, 255, .08), transparent 35%, rgba(0, 0, 0, .04)); }
.sheet .cm { border-color: rgba(21, 19, 15, .5); }
.ip-legal .sheet-k { padding-right: 0; }
.ip-legal .sheet-stamp { transform: rotate(-3deg); }
.ip-legal .sheet-lead { max-width: var(--measure); }
.ip-legal .p-sec { display: grid; grid-template-columns: minmax(0, 38rem) minmax(190px, 1fr); column-gap: clamp(28px, 3vw, 52px); align-items: start; }
.p-main { min-width: 0; }
.p-n { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-family: var(--f-m); font-size: 13px; letter-spacing: .08em; color: var(--ember-ink); }
.sheet .ic { width: 20px; height: 20px; stroke: #3d372e; }
.ip-legal .p-sec h2 { display: block; }
.sheet h2 em { color: #6a5432; }
.p-note { margin: 44px 0 0; padding-left: 18px; border-left: 1px solid rgba(21, 19, 15, .3); font-family: var(--f-m); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; line-height: 1.6; color: #4a443a; }
.p-flow { list-style: none; margin: 0 0 22px; padding: 0; text-transform: none; letter-spacing: 0; }
.p-flow li { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 12px; align-items: start; }
.p-flow li + li { margin-top: 26px; }
.p-flow li + li::before { content: '\2193'; position: absolute; left: 5px; top: -23px; font-size: 14px; line-height: 1; color: #3d372e; }
.p-flow b { display: block; font-family: var(--f-m); font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.p-flow span { font-family: var(--f-d); font-size: 14px; line-height: 1.45; color: #3d372e; }
.p-flow b { margin-bottom: 2px; }
@media (max-width: 1180px) {
  .ip-legal .p-sec { grid-template-columns: minmax(0, 1fr); }
  .p-note { margin: 4px 0 22px; }
}
@media (max-width: 760px) {
  .ip-legal .sheet-stamp { margin: 0 0 20px; }
}
@media (max-width: 600px) {
  .k-long { display: none; }
}