/* Gateway identity (approved 2026-10-27). Loaded last on every page; overrides the earlier wordmark sizing. */
/* Colours, fonts and the signature's size come from azab-tokens.css, a copy of the kit's (check.js compares them). */

/* Header: the horizontal lockup (AZAB + STUDIO on one baseline); under 700 px it would fall below its 140 px minimum, so the name alone. */
.brand img,.experience-home .header .brand img{width:150px;height:auto;display:block}

/* Footer: the badge, still; the motion lives in the opening. */
.footer-brand{--badge:clamp(150px,13vw,190px)}
.footer-mark,.footer-mark:hover{position:static;width:var(--badge);aspect-ratio:auto;overflow:visible;translate:none;margin-left:0}
.footer-mark img{display:block;width:100%;height:auto}

/* The big rig hangs from the top edge of the contact section, full bleed: the only rig on the site. */
.contact-rig{margin:-40px calc(var(--edge) * -1) 24px}
.contact-rig svg{display:block;width:100%;height:auto}
/* Switch-on, as the old rig did: each spot's beam drops in turn, then the lenses and screen modules light up. */
.contact-rig .rig-beam{transform-box:fill-box;transform-origin:50% 0;transition:opacity 1.1s ease var(--d,0s),transform 1.1s cubic-bezier(.2,.8,.2,1) var(--d,0s)}
.contact-rig .rig-lit{transition:opacity .5s ease calc(.9s + var(--d,0s))}
.rig-ready .contact-rig:not(.is-lit) .rig-beam{opacity:0;transform:scaleY(.6)}
.rig-ready .contact-rig:not(.is-lit) .rig-lit{opacity:0}

/* The opening motion is inline SVG, played once by experience.js. */
.portal-motion svg{display:block;width:100%;height:100%}

/* Light / Screen / Structure: the lit screen module stays solid while it moves (faded lime on soft black reads olive). */
.principle .cell,html.spatial-ready .principle .cell{animation:none;opacity:1}

/* Contact form on chartreuse: every line and word is solid soft black (faded black on lime reads olive);
   what a visitor types is Medium, so it still differs from the hints. */
.brief-form :is(input,select,textarea){font-weight:500}
.brief-form :is(input,select,textarea):focus{box-shadow:0 1px 0 var(--ink)}

/* Service icons: the kit's solid motifs. */
.services summary .service-icon{width:40px;height:40px}

/* Signature (approved 2026-10-27): "Turning / into" set right, "A Zone / A Brand." left, so A sits over A and Z over B
   and the lit initials read AZ over AB. The block spans the arch exactly: it starts on the arch's outer edge (4/338 of
   the badge in) and its width is the arch's (330/338); the token is the size at which the two columns fill it. */
.footer-brand .signature{display:grid;grid-template-columns:auto auto;column-gap:.26em;justify-content:start;
 font-size:calc(var(--badge) * var(--azab-signature-size));letter-spacing:-.02em;line-height:1.1;white-space:nowrap;margin-left:calc(var(--badge) * 4 / 338)}
.signature span:nth-child(odd){text-align:right}
.signature b{font-weight:inherit;color:var(--azab-chartreuse)}

@media(max-width:700px){
 .brand img,.experience-home .header .brand img{width:88px}
 .footer-brand{--badge:140px}
 .footer-mark,.footer-mark:hover{translate:none}
 .services summary .service-icon{width:32px;height:32px}
 .contact-rig{margin-top:-28px;overflow:hidden}
 .contact-rig svg{width:180%;max-width:none}  /* phones: the left half of the rig at a readable size */
}
@media(max-width:370px){.brand img,.experience-home .header .brand img{width:76px}}