/* /ai-agents/authorization · page layout glue only, scoped under body.pg-az.
   The three assets style themselves (.az-sheet, .az-day, .az-ceiling). Band order and reasons: build/pages/ai-agents-authorization/spec.md §2.
   Rhythm is v4.css only (--sec, .shead 64, .wrap 1280/24); nothing here adds section padding. */

/* ---------- hero (dark): left-aligned; the H1 runs across the wrap so each tone holds one line at 1440,
   then the sub, CTAs and az-sheet form a split row (V7 inner hero: text left, one product surface right) ---------- */
.pg-az .az-hero{text-align:left}
.pg-az .az-hero .h1{margin:0;max-width:none}
.pg-az .az-hero-row{display:grid;grid-template-columns:minmax(0,640px) minmax(0,1fr);column-gap:64px;align-items:start;margin-top:40px}
.pg-az .az-hero-row>*{min-width:0}
.pg-az .az-hero .sub{margin:0;max-width:560px}
.pg-az .az-hero .ctas{justify-content:flex-start}

/* visible breadcrumb in the eyebrow slot. Same rules as the shared .crumbs requested in apv R-2; scoped here until it lands */
.pg-az .az-crumbs{margin-bottom:24px}
.pg-az .az-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;line-height:20px;font-weight:500;color:var(--w-60)}
.pg-az .az-crumbs li{display:inline-flex;align-items:center;gap:8px}
.pg-az .az-crumbs li+li::before{content:"›";content:"›"/"";color:var(--w-60)}
.pg-az .az-crumbs a{display:inline-block;padding:2px 0;color:var(--w-60);transition:color .15s var(--ease)}
.pg-az .az-crumbs a:hover{color:#fff}
.pg-az .az-crumbs a:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:2px}
.pg-az .az-crumbs [aria-current="page"]{color:#fff}

/* body copy on the dark bands (v4.css has no .dark .body) */
.pg-az .dark .body{color:var(--w-60)}

/* ---------- definition (white): two short paragraphs, then az-day under the .shead ---------- */
.pg-az .az-def .body+.body{margin-top:12px}

/* ---------- ceiling (dark): body left, az-ceiling right, top-aligned ---------- */
.pg-az .az-ceil-row{display:grid;grid-template-columns:minmax(0,470px) minmax(0,1fr);column-gap:96px;align-items:start}
.pg-az .az-ceil-row>*{min-width:0}
.pg-az .az-ceil-copy .body{max-width:470px}

/* ---------- outcomes (white, type-only): four definitions in ink, a hairline over each; no boxes, icons or status colour ---------- */
.pg-az .az-oc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:64px;row-gap:48px;margin:0}
.pg-az .az-oc>div{min-width:0;padding-top:24px;border-top:1px solid var(--ink-15)}
.pg-az .az-oc dt{font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.pg-az .az-oc dd{margin:8px 0 0;max-width:440px;font-size:17px;line-height:28px;color:var(--ink-60)}
.pg-az .az-oc-foot{margin-top:64px}
.pg-az .az-oc-foot .body{max-width:600px}
.pg-az .az-oc-foot .tlink{margin-top:24px}

/* ---------- call path (dark, type-only): split two-tone header, H2 left (730 keeps each tone on one line), copy right ---------- */
.pg-az .az-cp{grid-template-columns:minmax(0,730px) minmax(0,1fr);column-gap:64px;align-items:start;margin-bottom:0}
.pg-az .az-cp-copy{padding-top:44px}   /* the copy starts level with the H2's first line, under the eyebrow row */
.pg-az .az-cp-copy .body{max-width:438px}
.pg-az .az-cp-copy .body+.body{margin-top:16px}
.pg-az .az-cp .az-cp-sig{color:var(--w-85)}
.pg-az .az-cp-links{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:28px}
.pg-az .az-cp-links .tlink{margin-top:0}

/* ---------- FAQ (white): a wider heading column so "Authorization questions, answered." sets in two clean lines ---------- */
.pg-az .faqwrap{grid-template-columns:minmax(0,540px) minmax(0,1fr)}
.pg-az .az-spoke{display:flex;flex-direction:column;gap:16px;margin-top:32px}
.pg-az .az-spoke p{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.pg-az .az-spoke-l{font-size:14px;line-height:20px;color:var(--ink-60)}

/* ---------- close (dark, type-only, centred) ---------- */
.pg-az .az-close .wrap{text-align:center}
.pg-az .az-close-ctas{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:36px}

/* ---------- responsive ---------- */
@media (max-width:1240px){
  .pg-az .az-cp{grid-template-columns:minmax(0,1fr);row-gap:24px}
  .pg-az .az-cp-copy{padding-top:0}
  .pg-az .az-cp-copy .body{max-width:600px}
}
@media (max-width:1100px){
  .pg-az .az-hero-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px}
  .pg-az .faqwrap{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:1000px){
  .pg-az .az-ceil-row{grid-template-columns:minmax(0,1fr);row-gap:48px}
  .pg-az #ceiling .shead{margin-bottom:20px}   /* stacked: the body joins the head at the .shead.stack gap, like every other section */
}
@media (max-width:860px){
  .pg-az .az-hero-row{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px) and (min-width:761px){
  .pg-az .az-hero-art{margin-top:40px}   /* at <=760 az-sheet adds its own 40px */
}
@media (max-width:760px){
  .pg-az .az-hero-row{margin-top:24px}
  .pg-az .az-ceil-row{row-gap:40px}
  .pg-az .az-oc{grid-template-columns:minmax(0,1fr);row-gap:32px}
  .pg-az .az-oc>div{padding-top:20px}
  .pg-az .az-oc dt{font-size:18px;line-height:26px}
  .pg-az .az-oc dd{font-size:16px;line-height:26px}
  .pg-az .az-oc-foot{margin-top:48px}
  .pg-az .az-cp-links{flex-direction:column;align-items:flex-start}
}