/* Bridge: gives the older Tailwind pages the new site style without touching their content.
   Loaded after atlas.css on pages whose <body> has class "bridge". It remaps the old black/zinc/orange
   utility classes to the new paper/navy/rust palette and swaps Inter for the new type.
   Rules are prefixed with body.bridge so they win over Tailwind's own (later-injected) classes.
   Dark areas (hero sections, image overlays, orange buttons) keep light text; everything else is paper. */

/* ---------- page ---------- */
body.bridge{background:var(--paper)!important;color:var(--ink);font-family:var(--f-body)}
body.bridge main{background:var(--paper)}

/* ---------- type ---------- */
body.bridge h1,body.bridge h2,body.bridge h3,body.bridge h4{font-family:var(--f-head);font-weight:400!important;text-transform:none!important;letter-spacing:-.005em!important;line-height:1.08}
body.bridge h1{line-height:1.02}
body.bridge .uppercase:not(h1):not(h2):not(h3):not(h4),
body.bridge button.story-tab,body.bridge .tracking-widest{font-family:var(--f-label);font-weight:700;letter-spacing:.14em}
body.bridge .font-mono{font-family:"DejaVu Sans Mono",Menlo,monospace}
body.bridge .text-xs.uppercase{font-size:.8rem}
body.bridge p,body.bridge li,body.bridge td,body.bridge dd{line-height:1.6}

/* ---------- light (paper) areas ---------- */
body.bridge .bg-black{background-color:var(--paper)}
body.bridge .bg-zinc-950{background-color:var(--paper2)}
body.bridge [class*="bg-zinc-950/"]{background-color:rgba(231,223,208,.55)}
body.bridge .bg-zinc-900{background-color:#DDD3C0}
body.bridge .bg-zinc-900\/50{background-color:#FBF8F2}
body.bridge .hover\:bg-zinc-900:hover,body.bridge .hover\:bg-zinc-800:hover{background-color:#D8CDB6}
body.bridge .text-white{color:var(--ink)}
body.bridge .text-zinc-200,body.bridge .text-zinc-300{color:#2E3646}
body.bridge .text-zinc-400{color:var(--muted)}
body.bridge .text-zinc-500{color:#687080}
body.bridge .text-zinc-600{color:#858B95}
body.bridge .text-orange-500,body.bridge .text-blue-500{color:var(--rust)}
body.bridge .hover\:text-orange-500:hover,body.bridge .group:hover .group-hover\:text-orange-500,
body.bridge .hover\:text-orange-400:hover,body.bridge .group:hover .group-hover\:text-orange-400,
body.bridge .hover\:text-blue-400:hover{color:var(--rust-dark)}
body.bridge .hover\:text-white:hover,body.bridge .hover\:text-zinc-300:hover{color:var(--ink)}
body.bridge .border-zinc-800,body.bridge .border-zinc-800\/80,body.bridge .divide-zinc-800>*+*{border-color:var(--line)}
body.bridge .border-zinc-900{border-color:#E0D8C8}
body.bridge .border-zinc-600,body.bridge .hover\:border-zinc-600:hover,body.bridge .hover\:border-zinc-700:hover{border-color:#B9AE98}
body.bridge .border-orange-500,body.bridge .border-orange-600,body.bridge .hover\:border-orange-500:hover,
body.bridge .focus\:border-orange-500:focus,body.bridge .group:hover .group-hover\:border-orange-500{border-color:var(--rust)}
body.bridge [class*="hover:border-orange-500/"]:hover{border-color:rgba(168,68,26,.5)}
body.bridge .bg-orange-500\/10{background-color:rgba(168,68,26,.08)}
body.bridge .border-orange-500\/20{border-color:rgba(168,68,26,.25)}

/* orange buttons and badges become rust, with light text */
body.bridge .bg-orange-600,body.bridge .bg-orange-500{background-color:var(--rust);color:#fff}
body.bridge .hover\:bg-orange-700:hover,body.bridge .hover\:bg-orange-600:hover,body.bridge .hover\:bg-orange-400:hover{background-color:var(--rust-dark)}
body.bridge .bg-orange-600.text-black,body.bridge .bg-orange-500.text-black,body.bridge .bg-orange-600 .text-black{color:#fff}
body.bridge a.bg-orange-600,body.bridge button.bg-orange-600,body.bridge a.bg-orange-500,body.bridge button.bg-orange-500{border-radius:4px}

/* form fields */
body.bridge input,body.bridge textarea,body.bridge select{font-family:var(--f-body);border-radius:4px}

/* ---------- dark areas: hero sections, image overlays, buttons ---------- */
body.bridge section[class*="-mt-[88px]"],
body.bridge section[class*="-mt-[88px]"] .bg-black{background-color:var(--navy)}
body.bridge [class*="bg-black/"]{background-color:rgba(28,36,51,.82)}
body.bridge section[class*="-mt-[88px]"] .text-white,body.bridge [class*="bg-black/"] .text-white,body.bridge [class*="bg-black/"].text-white{color:var(--paper)}
body.bridge section[class*="-mt-[88px]"] .text-zinc-200,body.bridge section[class*="-mt-[88px]"] .text-zinc-300,
body.bridge [class*="bg-black/"] .text-zinc-300,body.bridge [class*="bg-black/"].text-zinc-300,
body.bridge [class*="bg-black/"] .text-zinc-200{color:var(--soft)}
body.bridge section[class*="-mt-[88px]"] .text-zinc-400,body.bridge [class*="bg-black/"] .text-zinc-400,body.bridge [class*="bg-black/"].text-zinc-400{color:var(--muted2)}
body.bridge section[class*="-mt-[88px]"] .text-orange-500,body.bridge [class*="bg-black/"] .text-orange-500{color:var(--peach)}
body.bridge [class*="bg-black/"] .border-zinc-800,body.bridge [class*="bg-black/"].border-zinc-800{border-color:rgba(242,237,227,.18)}
body.bridge [class*="bg-black/"] .hover\:text-white:hover,body.bridge [class*="bg-black/"] .hover\:text-orange-500:hover{color:var(--peach)}

/* hero overlay gradients: black becomes navy */
body.bridge .from-black{--tw-gradient-from:#1C2433 var(--tw-gradient-from-position);--tw-gradient-to:rgb(28 36 51/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
body.bridge .via-black\/30{--tw-gradient-to:rgb(28 36 51/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgb(28 36 51/.3) var(--tw-gradient-via-position),var(--tw-gradient-to)}
body.bridge .via-black\/40{--tw-gradient-to:rgb(28 36 51/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgb(28 36 51/.4) var(--tw-gradient-via-position),var(--tw-gradient-to)}
body.bridge .to-black\/60{--tw-gradient-to:rgb(28 36 51/.6) var(--tw-gradient-to-position)}
body.bridge .to-black\/70{--tw-gradient-to:rgb(28 36 51/.7) var(--tw-gradient-to-position)}

/* justified paragraphs leave wide gaps on narrow screens */
@media (max-width:640px){body.bridge .text-justify{text-align:left}}

/* Meet the Team: two portraits have black (not transparent) corners; clip them to the circle */
body.bridge img[src$="Godfrey.webp"],body.bridge img[src$="Dekel.webp"]{border-radius:50%}
