/* One AZ vocabulary, distinct scenes. Loaded in the head through the theme contract. */
:root{--hero-red:#ce070d;--hero-ink:#101215;--hero-panel:#191c21;--hero-line:#ffffff29;--hero-type:clamp(42px,4.4vw,68px);--hero-gap:clamp(32px,4vw,64px);--hero-radius:10px}
body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero){font-family:var(--font-sans);color:#f7f6f2;background-color:var(--hero-ink)}
body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) h1{font-family:var(--font-sans);font-size:var(--hero-type);font-weight:700;line-height:1.1;letter-spacing:-.045em;margin-bottom:28px}
body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) .eyebrow,
body .agency-hero .agency-title-brand{color:var(--hero-red);font-size:12px;font-weight:700;letter-spacing:.14em;line-height:1.65;margin-bottom:28px}
body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) .eyebrow:before,
body .agency-title-brand:before{width:30px;height:3px;background:var(--hero-red)}
body :is(.service-hero,.journal-hero,.map-hero) h1>span{color:var(--hero-red)}
body :is(.hero-deck,.service-lead,.work-intro,.agency-intro,.journal-intro,.map-copy>p:not(.eyebrow)){font-size:clamp(18px,1.4vw,22px);line-height:1.75;color:#c7c9d0;max-width:45ch}
body :is(.service-hero-layout,.work-hero-layout,.agency-layout,.journal-hero-layout,.map-layout){grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:var(--hero-gap);padding-block:44px 64px;min-height:650px}
body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) .button{font-family:var(--font-sans);font-size:16px;min-height:54px;padding:16px 24px;background:var(--hero-red);border-color:var(--hero-red);border-radius:6px}
body :is(.hero-secondary,.service-more,.agency-contact){font-size:16px;color:#f7f6f2;font-weight:600}
body :is(.service-breadcrumbs,.work-breadcrumbs,.agency-breadcrumbs,.journal-breadcrumbs,.map-breadcrumbs) .breadcrumbs{padding-block:24px;font-size:12px;color:#bfc2ca;line-height:1.7}
body :is(.service-baseline,.work-baseline,.agency-baseline,.journal-baseline,.map-baseline,.trust-bar){position:relative;z-index:4;background:#14161a;border-top:1px solid #ffffff1c;border-bottom:1px solid #ffffff12;color:#d2d4db}
body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline)>.wrap{padding-block:24px;font-size:16px;line-height:1.7;letter-spacing:0;min-height:80px}
body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline) strong{font-size:16px;color:#f7f6f2;font-weight:600}
body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline) b{color:var(--hero-red)}
body .trust-bar p,body .trust-bar p>span{color:#c7c9d0}body .trust-bar strong{color:#f7f6f2}body .trust-bar .trust-plus{color:var(--hero-red)}
body :is(.hero-caption,.brand-specimen,.ai-process,.journal-edition,.atlas-heading,.web-showcase-heading){background:var(--hero-panel);border:1px solid var(--hero-line);border-radius:var(--hero-radius);color:#e7e8ec}
body :is(.work-gallery,.journal-features,.web-showcase-frame,.learn-composition figure,.editorial-gallery){border:1px solid var(--hero-line);border-radius:var(--hero-radius)}
body .journal-pages{display:none}
body .work-gallery{animation:none;transform:none}
body :is(.work-tabs,.journal-selectors,.web-project-selectors){gap:12px;margin-top:24px}
body :is(.work-tabs,.journal-selectors,.web-project-selectors) button{border:1px solid #ffffff3a;border-radius:var(--hero-radius);background:var(--hero-panel);color:#f4f3ef;font-family:var(--font-sans);font-size:14px;font-weight:600;padding:16px;line-height:1.45;gap:10px;min-height:80px}
body :is(.work-tabs,.journal-selectors,.web-project-selectors) button[aria-pressed=true]{background:#32181d;border-color:var(--hero-red)}
body :is(.work-tab-number,.journal-selector-number,.web-project-selectors button>span){display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;padding:0;border-radius:50%;background:#34373e;color:#f4f3ef;font:500 11px var(--font-sans)}
body :is(.work-tabs,.journal-selectors) button[aria-pressed=true] :is(.work-tab-number,.journal-selector-number),body .web-project-selectors button[aria-pressed=true]>span{background:var(--hero-red);color:#fff}
body .journal-selectors button{min-height:108px}
body .journal-selectors button>span:nth-child(2){-webkit-line-clamp:3}
body :is(.work-signature,.agency-promise,.journal-promise){font-size:14px;line-height:1.7;color:#c7c9d0}
body .agency-depth{transform:none;transition:none}
@media(min-width:851px){body .hero .hero-copy{width:660px;max-width:58%}body .hero .hero-deck{max-width:560px}body .hero:after{background:linear-gradient(90deg,#0d0f12fa 0%,#0d0f12ed 30%,#0d0f12bd 49%,#0d0f1240 58%,transparent 68%)}}
body :is(.work-tabs,.journal-selectors,.web-project-selectors) button{font-size:16px}
body :is(.work-signature,.agency-promise,.journal-promise){font-size:16px}
body .editorial-wordmark>span{font-family:var(--font-sans);font-weight:700;letter-spacing:-.045em;-webkit-text-stroke:0;text-shadow:none}
body .editorial-wordmark>span:nth-child(2){color:var(--hero-red)}

/* Light moves on the metal arc and through the scene, independently of the pointer. */
.brand-light{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.brand-ring-highlight{stroke-dasharray:62 938;animation:brand-reflection 14s linear infinite;opacity:.85}
.brand-spark{animation:brand-spark-rise var(--spark-duration) ease-in-out infinite;animation-delay:var(--spark-delay);will-change:transform,opacity}
@keyframes brand-reflection{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
@keyframes brand-spark-rise{0%{transform:translate3d(-12px,35px,0);opacity:0}20%{opacity:.75}70%{opacity:.65}100%{transform:translate3d(25px,-65px,0);opacity:0}}

/* The offer is demonstrated as an assembling website, with a stable price. */
body .world-offer .service-visual{height:auto;min-height:0}
.world-offer .service-signals{opacity:.4}
.offer-studio{width:100%;position:relative;isolation:isolate}
.offer-studio-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px;font-size:15px;color:#d4d7dd}
.offer-building-dot{width:8px;height:8px;border-radius:50%;background:var(--hero-red);box-shadow:0 0 0 6px #ce070d22;animation:offer-light 3s ease-in-out infinite}
.offer-build-scene{position:relative;padding:26px 20px 22px;isolation:isolate;perspective:1200px}
.offer-build-grid{position:absolute;inset:0;background:linear-gradient(#ce070d15 1px,transparent 1px),linear-gradient(90deg,#ce070d15 1px,transparent 1px),radial-gradient(ellipse,#ce070d20,transparent 72%);background-size:32px 32px,32px 32px,100% 100%;border:1px solid #ce070d38;border-radius:10px;z-index:-1}
.offer-site{overflow:hidden;border-radius:8px;background:#f6f3ed;border:1px solid #ffffff45;box-shadow:0 25px 45px #0005;animation:offer-site-breathe 12s ease-in-out infinite;will-change:transform}
.offer-site-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;padding:15px 18px;color:#25262a;animation:offer-nav-build 12s ease-in-out infinite}
.offer-site-nav>strong{font-size:12px;font-weight:650}.offer-site-nav>span{display:flex;gap:9px;align-items:center}.offer-site-nav i{width:25px;height:3px;background:#c4c5c9}.offer-site-nav b{display:grid;place-items:center;width:24px;height:20px;background:var(--hero-red);color:#fff;font-size:13px;border-radius:3px}
.offer-site-hero{display:grid;grid-template-columns:1.05fr .95fr;min-height:200px;overflow:hidden;background:#252a2c;color:#fff}
.offer-site-hero>div{padding:24px 18px;position:relative;z-index:1;display:flex;flex-direction:column;align-items:start;justify-content:center;gap:15px;animation:offer-copy-build 12s ease-in-out infinite}
.offer-site-hero small{font-size:7px;letter-spacing:.1em;color:#ff9c91}.offer-site-hero strong{font-size:clamp(21px,2vw,31px);line-height:1.17;letter-spacing:-.04em;font-weight:650}.offer-site-hero span{font-size:8px;background:var(--hero-red);border-radius:3px;padding:8px 10px}.offer-site-hero>img{width:100%;height:100%;object-fit:cover;object-position:63% center;animation:offer-image-build 12s ease-in-out infinite}
.offer-site-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:17px;background:#f6f3ed}
.offer-site-cards>div{background:#fff;padding:12px 10px;border:1px solid #e7e3dd;animation:offer-card-build 12s ease-in-out infinite;animation-delay:calc(var(--build-step)*.25s)}
.offer-site-cards span{font-size:8px;color:var(--hero-red);display:block;margin-bottom:8px}.offer-site-cards strong{display:block;color:#242629;font-size:9px;line-height:1.4;margin-bottom:10px}.offer-site-cards i{display:block;width:100%;height:3px;background:#dedbd5;margin-top:4px}.offer-site-cards i:last-child{width:70%}
.offer-studio-price{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 24px;margin-top:24px;border:1px solid var(--hero-line);border-left:3px solid var(--hero-red);border-radius:10px;background:var(--hero-panel)}
.offer-studio-price>div>span{display:block;color:#bec3cc;font-size:12px}.offer-studio-price strong{display:block;font-size:54px;line-height:1.25;letter-spacing:-.05em;font-weight:700}.offer-studio-price strong>small{font-size:16px;letter-spacing:0;font-weight:450}.offer-studio-price b{color:var(--hero-red);font-weight:600;font-size:.7em}.offer-studio-price>div>small{display:block;color:#bec3cc;font-size:11px}.offer-studio-price p{font-size:17px;line-height:1.5;font-weight:550;margin:0}
.offer-studio-steps{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:#c5c9d2;margin-top:18px}.offer-studio-steps i{color:var(--hero-red);font-style:normal}.offer-studio-steps>span{animation:offer-step 12s ease-in-out infinite}.offer-studio-steps>span:nth-of-type(2){animation-delay:-8s}.offer-studio-steps>span:nth-of-type(3){animation-delay:-4s}
.offer-site-nav,.offer-site-hero>div,.offer-site-hero>img{animation-delay:-4s}.offer-site-cards>div{animation-delay:calc(-4s + var(--build-step)*.25s)}
@keyframes offer-light{50%{opacity:.5;transform:scale(.8)}}
@keyframes offer-site-breathe{0%,100%{transform:translate3d(0,7px,0)}45%,75%{transform:translate3d(0,-7px,0)}}
@keyframes offer-nav-build{0%,100%{opacity:.25;transform:translateY(-12px)}12%,85%{opacity:1;transform:translateY(0)}95%{opacity:.25;transform:translateY(-12px)}}
@keyframes offer-copy-build{0%,8%,100%{opacity:.08;transform:translateX(-24px)}25%,85%{opacity:1;transform:translateX(0)}95%{opacity:.08;transform:translateX(-24px)}}
@keyframes offer-image-build{0%,12%,100%{opacity:.08;transform:translateX(24px)}30%,85%{opacity:1;transform:translateX(0)}95%{opacity:.08;transform:translateX(24px)}}
@keyframes offer-card-build{0%,18%,100%{opacity:.08;transform:translateY(22px)}38%,80%{opacity:1;transform:translateY(0)}92%{opacity:.08;transform:translateY(22px)}}
@keyframes offer-step{0%,28%,100%{color:#fff}35%,94%{color:#737982}}
@media(max-width:1100px){body :is(.service-hero-layout,.work-hero-layout,.agency-layout,.journal-hero-layout,.map-layout){gap:32px;min-height:610px}body :is(.work-tabs,.journal-selectors,.web-project-selectors) button{font-size:13px;padding:12px;gap:8px}.offer-site-hero strong{font-size:24px}.offer-studio-price{padding:18px}.offer-studio-price p{font-size:14px}.offer-site-hero{min-height:170px}.offer-site-hero>div{padding:18px 14px}.offer-site-cards{padding:12px;gap:8px}}
@media(max-width:850px){
 :root{--hero-type:clamp(38px,7.1vw,60px)}
 body :is(.service-hero-layout,.work-hero-layout,.agency-layout,.journal-hero-layout,.map-layout){grid-template-columns:1fr;gap:36px;min-height:0;padding-block:26px 38px}
 body :is(.hero-deck,.service-lead,.work-intro,.agency-intro,.journal-intro,.map-copy>p:not(.eyebrow)){font-size:18px;max-width:55ch}
 body :is(.service-visual,.work-visual,.agency-universe,.journal-editorial,.map-atlas){width:100%;max-width:620px;margin-inline:auto}
 body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline)>.wrap{flex-wrap:wrap;gap:10px 24px;font-size:15px}
 body .journal-selectors button{min-height:100px}
 .world-offer .service-visual{min-height:0}.offer-site-hero{min-height:230px}.offer-site-hero strong{font-size:32px}.offer-site-cards strong{font-size:11px}.offer-site-cards{padding:18px}.offer-studio-price p{font-size:17px}
}
@media(max-width:600px){
 :root{--hero-type:clamp(34px,8.6vw,48px)}
 body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) .eyebrow,body .agency-hero .agency-title-brand{font-size:10px;letter-spacing:.11em;margin-bottom:22px}
 body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) h1{margin-bottom:22px}
 body :is(.hero-deck,.service-lead,.work-intro,.agency-intro,.journal-intro,.map-copy>p:not(.eyebrow)){font-size:16px;line-height:1.75}
 body :is(.service-breadcrumbs,.work-breadcrumbs,.agency-breadcrumbs,.journal-breadcrumbs,.map-breadcrumbs) .breadcrumbs{padding-block:18px;font-size:11px}
 body :is(.hero,.service-hero,.work-hero,.agency-hero,.journal-hero,.map-hero) .button{font-size:14px;min-height:50px;padding:14px 20px}
 body :is(.hero-secondary,.service-more,.agency-contact){font-size:14px}
 body :is(.work-tabs,.journal-selectors,.web-project-selectors) button{padding:12px 14px;min-height:62px;font-size:14px}
 body .journal-selectors{grid-template-columns:1fr}body .journal-selectors button>span:nth-child(2){-webkit-line-clamp:2}
 body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline)>.wrap{padding-block:20px;font-size:14px;min-height:0}
 body :is(.service-baseline,.work-baseline,.journal-baseline,.map-baseline) strong{font-size:14px}
 .offer-build-scene{padding:17px 12px}.offer-site-hero{min-height:155px}.offer-site-hero>div{padding:18px 12px;gap:10px}.offer-site-hero strong{font-size:23px}.offer-site-hero small{font-size:6px}.offer-site-nav{padding:12px}.offer-site-nav>strong{font-size:10px}.offer-site-nav i{width:15px}.offer-site-cards{padding:10px;gap:6px}.offer-site-cards>div{padding:9px 7px}.offer-site-cards strong{font-size:8px}
 .offer-studio-price{padding:16px;gap:12px}.offer-studio-price strong{font-size:43px}.offer-studio-price p{font-size:13px}.offer-studio-price>div>span{font-size:10px}.offer-studio-price>div>small{font-size:9px}.offer-studio-steps{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .brand-spark{animation-duration:15s;opacity:.65}.brand-ring-highlight{animation-duration:22s;opacity:.6}
 .offer-site{animation:none}.offer-site-nav,.offer-site-hero>div,.offer-site-hero>img,.offer-site-cards>div{animation-name:offer-soft-build;transform:none}.offer-building-dot{animation:none}
}
@keyframes offer-soft-build{0%,100%{opacity:.82}30%,85%{opacity:1}}
