/*!
 * Appyugo theme styles v1.0.0
 * 1. Tokens (colours, type, spacing, radius, shadow) from the Appyugo design system
 * 2. Components (buttons, tiles, cards, logo wall, waves)
 * 3. Page sections (hero, what we do, bespoke, contact, header, footer)
 * 4. Responsive grids, masthead animation and hover/press gestures
 * Change brand colours in section 1 only; everything else reads these variables.
 */

/* ===== 1. Tokens ===== */
/* Appyugo — generated from tokens.json */
:root {
  --teal-500: #6fb0c3; --teal-700: #2a6f84; --teal-900: #0e2a33; --teal-200: #bedbe4; --teal-100: #e3f0f4;
  --surface-100: #f9faf7; --surface-0: #ffffff; --ink: #000000; --ink-muted: #4b5a5f; --ink-inverse: #f9faf7;
  --on-action: #ffffff; --line: #d7e3e7; --accent-blue: #3a7bd5; --focus: #2a6f84;
  --shadow-card: 0 1px 2px rgba(14,42,51,0.06), 0 8px 24px rgba(14,42,51,0.08);
  --shadow-lift: 0 12px 32px rgba(14,42,51,0.16);
}
:root {
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px; --space-24: 96px;
  --radius-sm: 8px; --radius-md: 16px; --radius-lg: 28px; --radius-pill: 999px;
  --font-display: Jost, "Futura PT", Futura, "Century Gothic", sans-serif;
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ===== 2. Components ===== */

/* Appyugo components — every value comes from tokens.css */
.ay-icon { flex: none; display: block; }

/* Button */
.ay-btn { display: inline-flex; align-items: center; gap: var(--space-2); border-radius: var(--radius-pill); border: 2px solid transparent; font-family: var(--font-body); font-weight: 600; text-decoration: none; cursor: pointer; transition: background .15s, color .15s, border-color .15s, transform .15s; }
.ay-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ay-btn:active { transform: translateY(1px); }
.ay-btn--sm { font-size: 14px; line-height: 20px; padding: 6px var(--space-4); }
.ay-btn--md { font-size: 15px; line-height: 20px; padding: 10px var(--space-6); }
.ay-btn--lg { font-size: 17px; line-height: 24px; padding: 14px var(--space-8); }
.ay-btn--primary { background: var(--teal-700); color: var(--on-action); }
.ay-btn--primary:hover { background: var(--teal-900); color: var(--ink-inverse); }
.ay-btn--secondary { background: transparent; color: var(--teal-700); border-color: var(--teal-700); }
.ay-btn--secondary:hover { background: var(--teal-100); }
.ay-btn--ghost { background: transparent; color: var(--ink); padding-left: var(--space-2); padding-right: var(--space-2); }
.ay-btn--ghost:hover { color: var(--teal-700); }
.ay-btn--onbrand { background: var(--ink); color: var(--surface-100); }
.ay-btn:disabled { opacity: .45; cursor: not-allowed; }

/* Section heading */
.ay-heading { max-width: 720px; display: grid; gap: var(--space-3); }
.ay-heading--center { margin-inline: auto; text-align: center; justify-items: center; }
.ay-eyebrow { margin: 0; font: 700 13px/16px var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--teal-700); }
.ay-heading__title { margin: 0; font: 700 44px/48px var(--font-display); color: var(--ink); }
.ay-heading__lead { margin: 0; font: 400 19px/30px var(--font-body); color: var(--ink-muted); }

/* Nav */
.ay-nav { display: flex; align-items: center; gap: var(--space-6); padding: var(--space-4) var(--space-6); background: var(--surface-100); border-bottom: 1px solid var(--line); font-family: var(--font-body); }
.ay-nav__brand { display: flex; align-items: center; gap: var(--space-2); text-decoration: none; color: var(--ink); }
.ay-nav__mark { height: 32px; width: auto; }
.ay-nav__word { font: 800 20px/1 var(--font-display); letter-spacing: .02em; }
.ay-nav__links { display: flex; gap: var(--space-6); list-style: none; margin: 0 0 0 auto; padding: 0; }
.ay-nav__links a { color: var(--ink); text-decoration: none; font-weight: 500; font-size: 15px; }
.ay-nav__links a:hover { color: var(--teal-700); }
@media (max-width: 720px) { .ay-nav__links { display: none; } .ay-nav .ay-btn { margin-left: auto; } }

/* Service tile — the deck's teal squircle */
.ay-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); aspect-ratio: 1; min-width: 140px; padding: var(--space-6); border-radius: var(--radius-lg); text-decoration: none; text-align: center; transition: transform .15s, box-shadow .15s; }
a.ay-tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.ay-tile--brand { background: var(--teal-500); color: var(--surface-100); }
.ay-tile--brand .ay-tile__label { color: var(--ink); }
.ay-tile--tint { background: var(--teal-200); color: var(--teal-700); }
.ay-tile--tint .ay-tile__label { color: var(--ink); }
.ay-tile__label { font: 700 20px/24px var(--font-display); }

/* Plan card */
.ay-plan { display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-8); background: var(--surface-0); border: 1px solid var(--line); border-radius: var(--radius-lg); font-family: var(--font-body); color: var(--ink); }
.ay-plan--featured { background: var(--teal-200); border-color: transparent; box-shadow: var(--shadow-lift); }
.ay-plan__head { display: flex; gap: var(--space-4); align-items: center; }
.ay-plan__icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--radius-md); background: var(--teal-500); color: var(--surface-100); flex: none; }
.ay-plan__name { margin: 0; font: 600 22px/28px var(--font-display); }
.ay-plan__tagline { margin: 2px 0 0; font-size: 14px; line-height: 22px; color: var(--ink-muted); }
.ay-plan__price { margin: 0; font: 700 28px/32px var(--font-display); }
.ay-plan__features { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); flex: 1; }
.ay-plan__features li { display: flex; gap: var(--space-2); align-items: flex-start; font-size: 15px; line-height: 22px; }
.ay-plan__features .ay-icon { color: var(--teal-700); margin-top: 2px; }
.ay-plan .ay-btn { align-self: flex-start; }

/* Product card */
.ay-product { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-8); background: var(--surface-0); border: 1px solid var(--line); border-radius: var(--radius-md); font-family: var(--font-body); color: var(--ink); }
.ay-product__brand { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 56px; }
.ay-product__logo { display: block; width: auto; height: auto; max-width: min(100%, 240px); max-height: 56px; object-fit: contain; object-position: left center; }
.ay-product__name { font: 700 24px/28px var(--font-display); }
.ay-product__desc { margin: 0; font-size: 16px; line-height: 26px; flex: 1; }
.ay-product__audience { margin: 0; padding: var(--space-3) var(--space-4); background: var(--teal-100); border-radius: var(--radius-sm); font-size: 14px; line-height: 22px; }
.ay-product__audience span { color: var(--ink-muted); }
.ay-badge { display: inline-block; padding: 2px 10px; border-radius: var(--radius-pill); background: var(--teal-200); color: var(--ink); font: 600 12px/18px var(--font-body); white-space: nowrap; }
.ay-link { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--teal-700); font-weight: 600; text-decoration: none; font-size: 15px; }
.ay-link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Testimonial */
.ay-quote { margin: 0; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-8); background: var(--surface-0); border-radius: var(--radius-md); box-shadow: var(--shadow-card); font-family: var(--font-body); color: var(--ink); }
.ay-quote__mark { color: var(--teal-500); }
.ay-quote blockquote { margin: 0; font-size: 17px; line-height: 28px; }
.ay-quote figcaption { display: flex; flex-direction: column; font-size: 14px; line-height: 20px; }
.ay-quote figcaption strong { font-weight: 700; }
.ay-quote figcaption span { color: var(--ink-muted); font-style: italic; }

/* Logo wall */
.ay-logos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--space-4); }
.ay-logos li { display: grid; place-items: center; height: 96px; padding: var(--space-4); background: var(--surface-0); border: 1px solid var(--line); border-radius: var(--radius-md); }
.ay-logos img { max-height: 56px; max-width: 100%; object-fit: contain; }
.ay-logos span { font: 600 15px/20px var(--font-display); color: var(--ink-muted); text-align: center; }

/* Wave */
.ay-wave { line-height: 0; }
.ay-wave svg { display: block; }
.ay-wave--brand path { fill: var(--teal-500); }
.ay-wave--deep path { fill: var(--teal-900); }
.ay-wave--tint path { fill: var(--teal-100); }
.ay-wave--flip svg { transform: scaleY(-1); }

/* ===== 3. Sections ===== */
/* ---------- Page base ---------- */
body{margin:0;background:var(--surface-100);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}
a{color:var(--teal-700)}a:hover{color:var(--teal-900)}
img{max-width:100%}
input,select,textarea,button{font:inherit}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
[id]{scroll-margin-top:80px}

.ay-container{max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box}
.ay-stack{display:flex;flex-direction:column;gap:48px}
.ay-section{padding:64px 0 96px}
.ay-section--tint{background:var(--teal-100);padding:0}
.ay-section--tint > .ay-container{padding-top:48px;padding-bottom:96px}
.ay-section--tint > .ay-wave{background:var(--surface-100)}
.ay-muted{margin:0;font-size:16px;line-height:26px;color:var(--ink-muted)}
.ay-card-title{margin:0;font:600 22px/28px var(--font-display)}
.ay-footnote{margin:0;text-align:center;font-size:15px;line-height:24px;color:var(--ink-muted)}
.ay-footnote a{font-weight:600}

/* ---------- Header / footer ---------- */
.ay-header{position:sticky;top:0;z-index:20}
.ay-nav__links a{white-space:nowrap}
.ay-footer{background:var(--teal-900);color:var(--ink-inverse);border-top:1px solid var(--teal-700)}
.ay-footer__inner{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;padding:32px 24px;font-size:14px;line-height:22px}
.ay-footer__brand{display:flex;align-items:center;gap:10px;color:var(--ink-inverse);text-decoration:none}
.ay-footer__brand img{height:28px;width:auto}
.ay-footer__brand span{font:800 18px/1 var(--font-display);letter-spacing:.02em}
.ay-footer nav{display:flex;flex-wrap:wrap;gap:20px}
.ay-footer a{color:var(--teal-200);text-decoration:none}.ay-footer a:hover{color:var(--ink-inverse)}
.ay-footer p{margin:0;color:var(--teal-200)}

/* ---------- Hero ---------- */
.ay-hero{max-width:1200px;margin:0 auto;padding:72px 24px 48px;box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:48px}
.ay-hero__copy{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:24px}
.ay-hero__title{margin:0;font:800 clamp(40px,5.2vw,68px)/1 var(--font-display);letter-spacing:-.01em;color:var(--ink)}
.ay-hero__title span{color:var(--teal-700)}
.ay-hero__lead{margin:0;max-width:34rem;font-size:19px;line-height:30px;color:var(--ink-muted)}
.ay-hero__actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ay-hero__trust{margin:8px 0 0;font-size:14px;line-height:22px;color:var(--ink-muted)}
.ay-hero__art{flex:1 1 420px;min-width:0;position:relative;max-width:560px}
.hs-slab{position:absolute;left:12%;top:0;width:70%;height:78%;background:var(--teal-500);border-radius:28px 180px 28px 28px}
.hs-bar{position:absolute;right:0;top:18%;width:18%;height:46%;background:var(--teal-700);border-radius:28px}
.hs-disc{position:absolute;left:0;top:54%;width:72px;height:72px;background:var(--teal-200);border-radius:999px}
.hs-card{position:absolute;left:26%;top:16%;width:42%;aspect-ratio:1;background:var(--surface-0);border-radius:28px;box-shadow:var(--shadow-lift);display:grid;place-items:center}
.hs-card img{width:68%;height:auto}
.hero-tags{position:absolute;left:4%;bottom:6%;display:flex;flex-wrap:wrap;gap:8px;max-width:92%}
.hero-tags>span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--surface-0);border-radius:999px;box-shadow:var(--shadow-card);font-weight:600;font-size:14px;color:var(--ink)}
.ay-dot{width:10px;height:10px;border-radius:999px;background:var(--teal-500);display:inline-block}
.ay-dot--2{background:var(--teal-700)}.ay-dot--3{background:var(--accent-blue)}

/* ---------- What we do ---------- */
.g-ways>article{display:flex;flex-direction:column;gap:20px;padding:32px;background:var(--surface-0);border:1px solid var(--line);border-radius:28px}
.ay-ways__tile{width:140px}
.g-ways .ay-tile{width:100%;box-sizing:border-box}
.g-ways .ay-link{margin-top:auto}

/* ---------- Bespoke ---------- */
.ay-split-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.ay-capability{padding:28px;background:var(--surface-0);display:flex;flex-direction:column;gap:12px}
.ay-capability__icon{color:var(--teal-700)}
.ay-capability h3{margin:0;font:600 20px/26px var(--font-display)}
.ay-capability p{margin:0;font-size:15px;line-height:24px;color:var(--ink-muted)}

/* ---------- Wall of wins ---------- */
.ay-logos li a{display:grid;place-items:center;width:100%;height:100%}

/* ---------- Contact ---------- */
.ay-contact{background:var(--teal-900);color:var(--ink-inverse)}
.ay-contact > .ay-wave{background:var(--teal-100)}
.ay-contact__inner{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start;padding-top:48px;padding-bottom:80px}
.ay-contact__copy{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:20px}
.ay-contact .ay-eyebrow{color:var(--teal-200)}
.ay-contact__title{margin:0;font:700 44px/48px var(--font-display);color:var(--ink-inverse)}
.ay-contact__lead{margin:0;font-size:19px;line-height:30px;color:var(--teal-200)}
.ay-contact__details{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:16px;line-height:24px}
.ay-contact__details a{color:var(--teal-200);font-weight:600}.ay-contact__details a:hover{color:var(--ink-inverse)}
.ay-form{flex:1 1 460px;min-width:0;padding:32px;background:var(--surface-0);color:var(--ink);border-radius:28px;box-shadow:var(--shadow-lift);box-sizing:border-box}
.ay-form form{display:flex;flex-direction:column;gap:18px}
.ay-form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.ay-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
.ay-form input,.ay-form select,.ay-form textarea{padding:0 14px;height:48px;border:1px solid var(--line);border-radius:8px;background:var(--surface-100);color:var(--ink);font-weight:400;box-sizing:border-box;width:100%}
.ay-form textarea{height:auto;padding:12px 14px;resize:vertical}
.ay-form .ay-btn{align-self:flex-start}
.ay-form__notice{margin:0;padding:12px 16px;border-radius:var(--radius-sm);background:var(--teal-100);color:var(--teal-900);font-weight:600;font-size:14px}
.ay-form__notice--error{background:var(--surface-0);border:2px solid var(--teal-900)}
@media (max-width:599px){.ay-contact__title{font-size:34px;line-height:40px}.ay-heading__title{font-size:34px;line-height:40px}.ay-form{padding:24px}}

/* ===== 4. Grids, motion, gestures ===== */

input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* Balanced grids: desktop ≥1024 · tablet 600–1023 · mobile <600 */
.g{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
.g-ways,.g-products{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-plans,.g-bespoke{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-plans{gap:20px;align-items:stretch}
.g-bespoke{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:28px;overflow:hidden}
.g-stories{grid-template-columns:repeat(2,minmax(0,1fr))}
.logos .ay-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.logos .ay-logos li{flex:0 0 calc((100% - 112px) / 8);box-sizing:border-box;height:112px;padding:14px}
.logos .ay-logos img{max-height:76px;max-width:100%;width:auto;height:auto;object-fit:contain}
.hero-art{height:460px}
.ay-plan__features{align-content:start}
/* Masthead motion: an entrance, then a slow float, each shape on its own timing */
@keyframes hs-in{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
@keyframes hs-float-a{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes hs-float-b{0%,100%{transform:translateY(0)}50%{transform:translateY(16px)}}
@keyframes hs-drift{0%,100%{transform:translate(0,0)}33%{transform:translate(10px,-14px)}66%{transform:translate(-6px,8px)}}
@keyframes hs-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(-1.5deg)}}
@keyframes hs-pop{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.hs{will-change:transform}
.hs-slab{animation:hs-in .8s cubic-bezier(.2,.7,.2,1) both,hs-float-a 7s ease-in-out .8s infinite}
.hs-bar{animation:hs-in .8s cubic-bezier(.2,.7,.2,1) .12s both,hs-float-b 6s ease-in-out .92s infinite}
.hs-disc{animation:hs-in .8s cubic-bezier(.2,.7,.2,1) .24s both,hs-drift 9s ease-in-out 1.04s infinite}
.hs-card{animation:hs-in .9s cubic-bezier(.2,.7,.2,1) .36s both,hs-bob 5s ease-in-out 1.26s infinite}
.hs-tags>span{animation:hs-pop .5s ease-out both}
.hs-tags>span:nth-child(1){animation-delay:.9s}.hs-tags>span:nth-child(2){animation-delay:1.02s}.hs-tags>span:nth-child(3){animation-delay:1.14s}
@media (prefers-reduced-motion:reduce){.hs,.hs-tags>span{animation:none}}
/* Gestures — hover lifts, press sinks, focus rings; same feel on every button and box */
.ay-btn,.ay-link,.ay-tile,.ay-plan,.ay-product,.ay-quote,.ay-logos li,.g-ways>article,.g-bespoke>div,.hero-tags>span{transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s,background-color .2s,border-color .2s,color .2s}
.ay-btn .ay-icon,.ay-link .ay-icon{transition:transform .22s cubic-bezier(.2,.7,.2,1)}
/* Buttons */
.ay-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-card)}
.ay-btn:hover .ay-icon,.ay-link:hover .ay-icon{transform:translateX(4px)}
.ay-btn:active{transform:translateY(0) scale(.97);box-shadow:none;transition-duration:.08s}
.ay-btn--ghost:hover{box-shadow:none}
.ay-link:active{transform:scale(.97)}
/* Clickable boxes: three-ways cards, service tiles */
.g-ways>article{position:relative}
.g-ways>article:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift);border-color:var(--teal-500)}
.g-ways>article:hover .ay-tile{transform:rotate(-3deg) scale(1.03)}
.g-ways>article:active{transform:translateY(-2px) scale(.99);transition-duration:.08s}
.g-ways>article>a::after{content:"";position:absolute;inset:0;border-radius:28px}
.g-ways>article>a:focus-visible{outline:none}
.g-ways>article:focus-within{outline:2px solid var(--focus);outline-offset:3px}
a.ay-tile:active{transform:scale(.96);transition-duration:.08s}
/* Plan + product cards */
.ay-plan:hover,.ay-product:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift);border-color:var(--teal-500)}
.ay-plan--featured:hover{transform:translateY(-8px)}
.ay-plan:hover .ay-plan__icon{transform:rotate(-6deg) scale(1.08)}
.ay-plan__icon{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.ay-plan:focus-within,.ay-product:focus-within{border-color:var(--teal-700)}
/* Bespoke boxes (joined grid: tint instead of lift so edges stay clean) */
.g-bespoke>div:hover{background:var(--teal-100)}
.g-bespoke>div>span{display:inline-block;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.g-bespoke>div:hover>span{transform:translateY(-3px) scale(1.12)}
/* Testimonials, logos, hero tags */
.ay-quote:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.ay-logos li:hover{transform:translateY(-3px);border-color:var(--teal-500);box-shadow:var(--shadow-card)}
.ay-logos li:hover span{color:var(--ink)}
.hero-tags>span:hover{transform:translateY(-2px)}
/* Touch: no sticky hover on phones, keep the press */
@media (hover:none){
  .ay-btn:hover,.g-ways>article:hover,.ay-plan:hover,.ay-product:hover,.ay-quote:hover,.ay-logos li:hover,.hero-tags>span:hover{transform:none;box-shadow:none}
  .ay-plan--featured:hover{box-shadow:var(--shadow-lift)}
  .g-ways>article:active,.ay-plan:active,.ay-product:active{transform:scale(.98)}
  .ay-logos li:active,.ay-quote:active{transform:scale(.98)}
}
@media (prefers-reduced-motion:reduce){
  .ay-btn,.ay-link,.ay-tile,.ay-plan,.ay-product,.ay-quote,.ay-logos li,.g-ways>article,.g-bespoke>div,.ay-icon,.ay-plan__icon,.g-bespoke>div>span{transition:background-color .2s,border-color .2s,color .2s!important;transform:none!important}
}
.ay-nav__links a,.ay-nav .ay-btn,.ay-nav__word{white-space:nowrap}
@media (max-width:1023px){
  .ay-nav__links{display:none}
  .ay-nav .ay-btn{margin-left:auto}
  .hero-art{margin-inline:auto}
  .g-plans,.g-bespoke{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g-products{grid-template-columns:minmax(0,1fr)}
  .logos .ay-logos li{flex-basis:calc((100% - 48px) / 4);height:120px}
  .hero-art{height:400px}
}
@media (max-width:719px){
  .g-ways,.g-stories{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:599px){
  .g-plans,.g-bespoke{grid-template-columns:minmax(0,1fr)}
  .logos .ay-logos{gap:12px}
  .logos .ay-logos li{flex-basis:calc((100% - 12px) / 2);height:108px}
  .logos .ay-logos img{max-height:68px}
  .hero-art{height:300px}
  .hero-tags{display:none !important}
}

/* ---------- Mobile / tablet menu ---------- */
.ay-nav{position:relative}
.ay-nav__toggle{display:none}
@media (max-width:1023px){
  .ay-nav__cta{margin-left:auto}
  .ay-nav__toggle{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface-0);color:var(--ink);cursor:pointer}
  .ay-nav.is-open .ay-nav__links{display:flex;flex-direction:column;gap:0;position:absolute;top:100%;left:0;right:0;margin:0;padding:8px 24px 16px;background:var(--surface-100);border-bottom:1px solid var(--line);box-shadow:var(--shadow-card)}
  .ay-nav.is-open .ay-nav__links a{display:block;padding:12px 0;font-size:17px}
}
@media (max-width:420px){.ay-nav{gap:12px;padding:12px 16px}.ay-nav__word{font-size:17px}}