/* Advisory — proposta di struttura. Tokens, type scale and borders follow the JET home. */
.eyebrow-mark{display:flex;align-items:center;gap:12px;margin:0;color:#676d70;font-size:12px;font-weight:550;line-height:18px;letter-spacing:.5px;text-transform:uppercase}
.eyebrow-mark::before{width:6px;height:6px;flex:0 0 6px;background:var(--red);content:""}
.on-dark .eyebrow-mark{color:#858b8e}

/* Manifesto: JET's own Advisory sentence, revealed word by word on scroll. */
.manifesto{padding:48px var(--page-margin) 200px;background:#fff;color:#090a0a}
.manifesto__text{max-width:1240px;margin:160px 0 0;font-size:clamp(40px,4.45vw,72px);font-weight:400;line-height:1.04;letter-spacing:-.04em;text-wrap:pretty}
.manifesto__word{color:#c4c9cc;transition:color .2s linear}
.manifesto__word.is-on{color:#090a0a}

/* Full-bleed statement with slow photo drift. */
.statement{position:relative;height:min(860px,calc(100svh / var(--jet-zoom, 1)));min-height:600px;overflow:hidden;background:#090a0a;color:#fff;isolation:isolate}
.statement__image{position:absolute;inset:-8% 0;z-index:-2;width:100%;height:116%;object-fit:cover;will-change:transform}
.statement::after{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,14,20,.12) 30%,rgba(4,14,20,.78));content:"";pointer-events:none}
.statement__inner{position:absolute;right:var(--page-margin);bottom:56px;left:var(--page-margin);display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:64px;align-items:end}
.statement__quote{max-width:1020px;margin:0;font-size:clamp(34px,3.6vw,56px);font-weight:400;line-height:1.06;letter-spacing:-.04em}
.statement__source{color:rgba(255,255,255,.72);font-size:14px;line-height:20px}
.statement__source strong{display:block;color:#fff;font-weight:550}

/* Proof: numbers and client grid, dark like the home’s client section. */
.proof{padding:40px var(--page-margin) 40px;background:var(--surface-dark-primary);color:#f7f7f5}
.proof__copy{display:grid;grid-template-columns:minmax(0,1fr) 460px;gap:80px;align-items:end;margin-top:200px}
.proof__title{max-width:760px;font-size:52px;font-weight:450;line-height:55px;letter-spacing:-.03em}
.proof__text{color:#858b8e;font-size:18px;line-height:24px}
.proof__text strong{color:#f7f7f5;font-weight:600}
.proof__stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:var(--gutter);margin:120px 0 0;padding:0 0 120px;list-style:none}
.proof__number{display:block;font-size:clamp(72px,7vw,120px);font-weight:400;line-height:1;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.proof__label{margin-top:16px;color:#858b8e;font-size:16px;line-height:22px}

/* Client logos: the home’s marquee, full-bleed inside the dark section, without rules. */
.proof__marquee{--logo-row-h:clamp(20px,calc(1.1vw + 14px),34px);position:relative;width:calc(100% + var(--page-margin) * 2);height:calc(var(--logo-row-h) * 1.9667 + 24px);margin:120px calc(var(--page-margin) * -1) 0;overflow:hidden}
.proof__marquee .trusted__track{--logo-copies:3;display:flex;align-items:center;width:max-content;height:100%}
.proof__marquee .trusted__set{display:flex;flex:none;align-items:center;height:100%}
.proof__marquee .trusted__cell{display:flex;flex:none;align-items:center;justify-content:center;width:clamp(110px,11vw,200px);height:100%;padding:0 16px}
.proof__marquee .trusted__cell img{display:block;width:auto;height:calc(var(--logo-row-h) * var(--logo-h,20) / 30);max-width:82%;object-fit:contain;filter:grayscale(1) invert(1);opacity:.64;transition:opacity .25s ease}
.proof__marquee .trusted__cell:hover img{opacity:.9}
@media(prefers-reduced-motion:no-preference){.proof__marquee:not(.is-driven) .trusted__track{animation:trusted-marquee 60s linear infinite}}
.proof__marquee .trusted__track{will-change:transform}
/* Soft edges: the script blurs and fades each logo as it nears the sides; CSS mask is the fallback. */
.proof__marquee:not(.is-driven){-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.proof__marquee::before{left:0;background:linear-gradient(90deg,var(--surface-dark-primary) 5%,rgba(9,10,10,0));-webkit-mask-image:linear-gradient(90deg,#000 15%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#000 15%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);mask-composite:intersect}
.proof__marquee::after{right:0;background:linear-gradient(270deg,var(--surface-dark-primary) 5%,rgba(9,10,10,0));-webkit-mask-image:linear-gradient(270deg,#000 15%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(270deg,#000 15%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);mask-composite:intersect}
@keyframes trusted-marquee{to{transform:translateX(calc(-100% / var(--logo-copies)))}}

/* Explorer keeps its approved look; only the top spacing follows the new rhythm. */
.advisory-explorer{padding-top:40px;padding-bottom:168px}
.advisory-explorer .sector-explorer{margin-top:96px}

/* Articles carousel: copied from the JET home. */
.articles-work { display:flex; width:100%; padding:120px 0; flex-direction:column; gap:40px; overflow:hidden; background:#fff; color:#090a0a; }
.articles-work__header { display:flex; height:56px; padding:0 var(--page-margin); align-items:center; gap:20px; }
.articles-work__title { margin:0; font-size:52px; font-weight:450; line-height:55px; letter-spacing:-.03em; }
.articles-work__controls { display:flex; margin-left:auto; gap:12px; }
.articles-work__control { display:flex; width:56px; height:56px; padding:0; align-items:center; justify-content:center; border:1px solid #e1e4e5; border-radius:50%; background:#fff; color:#090a0a; cursor:pointer; transition:background-color .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease; }
.articles-work__control svg { width:24px; height:24px; }
.articles-work__control:hover { border-color:var(--red); background:var(--red); color:#fff; }
.articles-work__control:disabled { opacity:.28; cursor:default; }
.articles-work__control:disabled:hover { border-color:#e1e4e5; background:#fff; color:#090a0a; }
.articles-work__viewport { width:100%; padding:0 var(--page-margin); overflow-x:auto; overflow-y:hidden; scrollbar-width:none; cursor:grab; touch-action:pan-x pan-y; }
.articles-work__viewport::-webkit-scrollbar { display:none; }
.articles-work__viewport.is-dragging { cursor:grabbing; user-select:none; }
.articles-work__track { display:flex; width:max-content; align-items:flex-start; gap:20px; }
.article-work-card { display:flex; width:calc((100vw - 148px)/3); min-width:320px; flex:0 0 auto; flex-direction:column; gap:20px; color:#090a0a; scroll-snap-align:start; }
.article-work-card__media { position:relative; width:100%; aspect-ratio:4/5; overflow:hidden; background:#ebebeb; }
.article-work-card__media img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.012); transition:transform .6s cubic-bezier(.22,1,.36,1),filter .28s ease; }
.article-work-card__badge { position:absolute; top:0; left:0; z-index:2; padding:4px 8px; background:var(--red); color:#fff; font-size:12px; font-weight:550; line-height:18px; opacity:0; pointer-events:none; transform:translate(-50%,-50%); transition:opacity .16s ease; will-change:transform; }
.article-work-card__details { display:flex; flex-direction:column; gap:4px; }
.article-work-card__title { margin:0; font-size:28px; font-weight:450; line-height:34px; letter-spacing:-.02em; }
.article-work-card__subtitle { margin:0; color:#4e5a61; font-size:18px; line-height:24px; }
.article-work-card:hover .article-work-card__media img { transform:scale(1.045); }
.article-work-card:hover .article-work-card__badge { opacity:1; }
.articles-work__footer { display:flex; height:56px; padding:0 var(--page-margin); }
.articles-work__all { display:inline-flex; min-height:56px; padding:16px 24px; align-items:center; justify-content:center; background:var(--red); color:#fff; font-size:16px; font-weight:550; line-height:24px; letter-spacing:-.02em; transition:background-color .18s ease; }
.articles-work__all:hover { background:#c91d1a; }

/* Scroll reveal */
.js [data-reveal]{opacity:0;transform:translateY(40px)}

@media(max-width:1100px){
  .proof__copy{gap:48px}
}
@media(max-width:1023px){
  .manifesto{padding-bottom:112px}
  .manifesto__text{margin-top:96px}
  .statement__inner{grid-template-columns:1fr;gap:28px;bottom:40px}
  .proof__copy{grid-template-columns:1fr;gap:24px;margin-top:120px}
  .proof__title{font-size:40px;line-height:44px}
  .proof__stats{grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:32px 16px;margin-top:64px;padding-bottom:72px}
  .proof__stats .proof__number{font-size:clamp(36px,11vw,48px);letter-spacing:-.05em}
  .proof__stats .proof__label{margin-top:10px;font-size:13px;line-height:18px}
  .proof__marquee{--logo-row-h:30px;margin-top:80px}
    .advisory-explorer{padding-bottom:96px}
  .advisory-explorer .sector-explorer{margin-top:96px}
}
@media(max-width:800px){
  .articles-work { padding:80px 0; gap:32px; }
  .articles-work__header { height:48px; }
  .articles-work__title { font-size:38px; line-height:42px; }
  .articles-work__controls { gap:8px; }
  .articles-work__control { width:46px; height:46px; }
  .article-work-card { width:calc(100vw - 64px); min-width:0; gap:16px; }
  .article-work-card__title { font-size:24px; line-height:30px; }
  .article-work-card__subtitle { font-size:16px; line-height:22px; }
  .articles-work__footer { height:52px; }
  .articles-work__all { min-height:52px; padding:14px 22px; font-size:15px; }
  .manifesto__text{font-size:34px;line-height:38px;letter-spacing:-.035em}
  .statement{height:calc(88svh / var(--jet-zoom, 1));min-height:560px}
  .statement__quote{font-size:30px;line-height:34px}
  .proof__title{font-size:34px;line-height:38px}
  .proof__text{font-size:16px;line-height:22px}
  .proof__number{font-size:72px}
  }
@media(prefers-reduced-motion:reduce){.js [data-reveal]{opacity:1;transform:none}.manifesto__word{color:#090a0a}}
@media(min-width:1600px){.manifesto__text{max-width:1640px}} /* wider line only on large monitors (02/11) */
/* 05/11 sector statement, built on icomat.co.uk's hotspot tags (DialogTriggerButton): glass pill rgba(255,255,255,.11)
   + blur 17px, radius 8px, mono-like uppercase 12px, padding 17/21/15/19; on hover a white fill slides in and the label
   rolls to black. Thin grid lines over the photo (their backgroundLines). Click opens a short glass note. */
.statement__grid{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);pointer-events:none}
.statement__grid i{border-right:1px solid rgba(255,255,255,.16)}
.statement__grid i:first-child{border-left:0}
.statement__kicker{position:absolute;z-index:2;left:var(--page-margin,32px);bottom:56px;max-width:460px;margin:0;color:rgba(255,255,255,.78);font-size:18px;line-height:1.45;letter-spacing:-.015em}
.statement__kicker strong{display:block;margin-bottom:6px;color:#fff;font-weight:500}
.statement__spots{position:absolute;inset:0;z-index:3;margin:0;padding:0;list-style:none}
.statement__spots li{position:absolute;transform:translate(-50%,-50%)}
.statement__spot{position:relative;display:flex;align-items:center;gap:12px;padding:17px 21px 15px 19px;border:0;border-radius:8px;background:rgba(255,255,255,.11);-webkit-backdrop-filter:blur(17px);backdrop-filter:blur(17px);color:#f8f8f8;font:500 12px/1 "Plus Jakarta Sans",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;overflow:hidden;isolation:isolate}
.statement__spot::before{position:absolute;inset:0;z-index:-1;background:#f8f8f8;content:"";transform:translateY(101%);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.statement__spot-label{display:block;height:1.2em;overflow:hidden}
.statement__spot-label span{display:block;line-height:1.2em;text-shadow:0 1.2em #090a0a;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.statement__spot-icon{position:relative;width:14px;height:14px;border:1px solid currentColor;border-radius:50%;transition:transform .45s cubic-bezier(.22,1,.36,1),color .3s}
.statement__spot-icon::before,.statement__spot-icon::after{position:absolute;top:50%;left:50%;width:6px;height:1px;background:currentColor;content:"";transform:translate(-50%,-50%)}
.statement__spot-icon::after{transform:translate(-50%,-50%) rotate(90deg)}
.statement__spot:hover::before,.statement__spot[aria-expanded="true"]::before{transform:none}
.statement__spot:hover .statement__spot-label span,.statement__spot[aria-expanded="true"] .statement__spot-label span{transform:translateY(-1.2em)}
.statement__spot:hover .statement__spot-icon,.statement__spot[aria-expanded="true"] .statement__spot-icon{color:#090a0a}
.statement__spot[aria-expanded="true"] .statement__spot-icon{transform:rotate(45deg)}
.statement__spot-text{position:absolute;top:calc(100% + 8px);left:0;width:260px;margin:0;padding:16px 18px;border-radius:8px;background:rgba(9,10,10,.62);-webkit-backdrop-filter:blur(17px);backdrop-filter:blur(17px);color:#fff;font-size:14px;line-height:1.45;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .22s cubic-bezier(.22,1,.36,1),transform .36s cubic-bezier(.22,1,.36,1),visibility .22s allow-discrete}
.statement__spots li.is-right .statement__spot-text{left:auto;right:0}
.statement__spot[aria-expanded="true"]+.statement__spot-text{opacity:1;visibility:visible;transform:none}
@media(max-width:800px){.statement__grid{grid-template-columns:repeat(2,1fr)}.statement__kicker{bottom:32px;right:var(--page-margin,20px);font-size:15px}.statement__spot{padding:12px 14px 10px 13px;font-size:10px;gap:8px}.statement__spot-text{width:200px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.statement__spot::before,.statement__spot-label span,.statement__spot-icon,.statement__spot-text{transition:none}}
.statement__spot{white-space:nowrap}
/* 05/11 v3 — glass kept (premium), JET's square corners and ink tint instead of milky white. */
.statement__spot,.statement__spot-text{border-radius:0}
.statement__spot{background:rgba(9,10,10,.42);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.statement__spot-text{background:rgba(9,10,10,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.statement__spot-icon{border-radius:0}
.statement__spot{text-transform:none;font-size:14px;letter-spacing:-.01em;font-weight:400}
/* JET arrow instead of the boxed plus; turns down when the note opens */
.statement__spot-icon{width:14px;height:14px;border:0;background:currentColor;-webkit-mask:var(--jet-arrow) center/contain no-repeat;mask:var(--jet-arrow) center/contain no-repeat}
.statement__spot-icon::before,.statement__spot-icon::after{display:none}
.statement__spot[aria-expanded="true"] .statement__spot-icon{transform:rotate(90deg)}
/* plain + (no box), turns into × when open */
.statement__spot-icon{width:12px;height:12px;background:none;-webkit-mask:none;mask:none}
.statement__spot-icon::before,.statement__spot-icon::after{display:block;width:12px;height:1.5px}
.statement__spot[aria-expanded="true"] .statement__spot-icon{transform:rotate(45deg)}

/* 05/11 — Hotspot dialog, built on icomat.co.uk's Dialog (values measured in their page):
   card max 452px, drops from -120px and fades in over ~700ms with a strong ease-out; title words rise from a mask;
   overlay fades in ~400ms (theirs grey 80% + blur 4px, ours ink); close = 300ms fade, no movement.
   JET: square corners (same as the hotspot tags), Plus Jakarta, red link arrow. */
.spot-dialog{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:100px 20px 40px;border:0;background:transparent;overflow-y:auto;display:none;justify-content:center;align-items:flex-start}
.spot-dialog[open]{display:flex}
.spot-dialog::backdrop{background:rgba(9,10,10,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .4s cubic-bezier(.22,1,.36,1)}
.spot-dialog.is-in::backdrop{opacity:1}
.spot-dialog.is-out::backdrop{opacity:0;transition-duration:.3s}
.spot-dialog__card{position:relative;width:100%;max-width:452px;padding:24px 24px 24px;background:#fff;color:#202020;box-shadow:0 20px 60px rgba(0,0,0,.3);opacity:0;transform:translateY(-120px)}
.spot-dialog.is-in .spot-dialog__card{opacity:1;transform:none;transition:transform .72s cubic-bezier(.16,1,.3,1),opacity .5s cubic-bezier(.22,1,.36,1)}
.spot-dialog.is-out .spot-dialog__card{opacity:0;transform:none;transition:opacity .3s cubic-bezier(.22,1,.36,1)}
.spot-dialog__top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.spot-dialog__title{margin:0;font-size:46px;font-weight:400;line-height:.98;letter-spacing:-.035em}
.spot-dialog__mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}
.spot-dialog__mask>span{display:inline-block;transform:translateY(100%)}
.spot-dialog.is-in .spot-dialog__mask>span{transform:none;transition:transform .66s cubic-bezier(.16,1,.3,1)}
.spot-dialog.is-in .spot-dialog__mask:nth-child(2)>span{transition-delay:.04s}
.spot-dialog.is-in .spot-dialog__mask:nth-child(3)>span{transition-delay:.08s}
.spot-dialog__close{position:relative;flex:none;width:40px;height:40px;border:1px solid #202020;background:none;cursor:pointer;transition:background .25s ease,color .25s ease;color:#202020}
.spot-dialog__close::before,.spot-dialog__close::after{position:absolute;top:50%;left:50%;width:14px;height:1.5px;background:currentColor;content:"";transform:translate(-50%,-50%) rotate(45deg)}
.spot-dialog__close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.spot-dialog__close:hover{background:#202020;color:#fff}
.spot-dialog__body{display:flex;flex-direction:column;gap:20px;margin-top:52px}
.spot-dialog__strong,.spot-dialog__soft{margin:0;font-size:19px;line-height:1.3;letter-spacing:-.015em}
.spot-dialog__soft{color:rgba(8,8,8,.5)}
.spot-dialog__link{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;margin-top:4px;color:#202020;font-size:16px;font-weight:500;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.spot-dialog__link::after{width:14px;height:14px;background:var(--red,#e5231f);-webkit-mask:var(--jet-arrow) center/contain no-repeat;mask:var(--jet-arrow) center/contain no-repeat;content:"";transition:transform .3s cubic-bezier(.22,1,.36,1)}
.spot-dialog__link:hover::after{transform:translateX(4px)}
.spot-dialog__media{margin:56px 0 0;aspect-ratio:16/9;overflow:hidden;background:#eef0f1}
.spot-dialog__media img{display:block;width:100%;height:100%;object-fit:cover}
.spot-dialog__close:focus-visible,.spot-dialog__link:focus-visible{outline:2px solid var(--red,#e5231f);outline-offset:3px}
@media(max-width:768px){.spot-dialog{padding:20px}.spot-dialog__title{font-size:35px}.spot-dialog__body{margin-top:36px}.spot-dialog__strong,.spot-dialog__soft{font-size:17px}.spot-dialog__media{margin-top:36px}}
@media(prefers-reduced-motion:reduce){.spot-dialog::backdrop,.spot-dialog__card,.spot-dialog__mask>span{transition:none!important;transform:none!important}.spot-dialog__card{opacity:1}}
html.jet-dialog-open{overflow:hidden}
.spot-dialog.is-out .spot-dialog__mask>span{transform:none} /* title stays put while the card fades out */
.spot-dialog__card:focus{outline:none}

/* 05/11 — Sector pages: the photo stays big and clean (no text on it, no dark veil), the sentence goes below on white,
   in two columns like the sector intro: signature on the left, sentence on the right. Service pages and Manufacturing unchanged. */
.statement--sotto{height:auto;min-height:0;padding-bottom:120px;overflow:visible;background:#fff;color:#090a0a}
.statement--sotto::after{display:none}
.statement--sotto .statement__image{position:relative;inset:auto;z-index:0;display:block;width:100%;height:min(760px,calc(78svh / var(--jet-zoom, 1)));transform:none!important}
.statement--sotto .statement__inner{position:static;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:64px;align-items:start;padding:56px var(--page-margin) 0}
.statement--sotto .statement__source{order:-1;color:#5d6265}
.statement--sotto .statement__source strong{color:#090a0a}
.statement--sotto .statement__quote{max-width:none;color:#090a0a;font-size:clamp(28px,2.8vw,40px);line-height:1.12;letter-spacing:-.03em}
@media(max-width:800px){.statement--sotto .statement__image{height:420px}.statement--sotto .statement__inner{grid-template-columns:1fr;gap:20px;padding-top:32px}.statement--sotto .statement__quote{font-size:26px;line-height:1.15}}
/* 06/11: statement with a video — on phones like the sector pages: clip edge to edge (16:9), then label + sentence
   in ink on white; no clip-path reveal (it made a floating box with uneven margins). */
@media(max-width:800px){
  .statement--video{height:auto;min-height:0;padding-bottom:72px;background:#fff;color:#090a0a;clip-path:none!important}
  .statement--video::after{display:none}
  .statement--video .statement__image{position:relative;inset:auto;z-index:0;display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transform:none!important}
  .statement--video .statement__inner{position:static;display:grid;grid-template-columns:1fr;gap:20px;padding:32px var(--page-margin,20px) 0}
  .statement--video .statement__source{order:-1;color:#5d6265}
  .statement--video .statement__source strong{color:#090a0a}
  .statement--video .statement__quote{color:#090a0a;font-size:26px;line-height:1.15;letter-spacing:-.03em}
}
/* 07/11: on phones the hotspot tags overlapped and ran off the photo (positions are tuned for desktop):
   they line up as tags at the top of the photo instead, same buttons and dialogs. */
@media(max-width:800px){
  html body .statement__spots{inset:auto;top:28px;right:var(--page-margin,20px);left:var(--page-margin,20px);display:flex;flex-wrap:wrap;gap:8px}
  html body .statement__spots li{position:static!important;left:auto!important;top:auto!important;transform:none}
  html body .statement__spot{padding:11px 13px 9px 12px;font-size:14px}
}
/* 07/11: Mobility — with the success case off, the KPI block (grey) starts right after a white section: give it its own top space */
body.page-id-160 .svc-results:not(.svc-path + .svc-results){padding-top:var(--sys-section,144px)}
@media(max-width:809px){body.page-id-160 .svc-results:not(.svc-path + .svc-results){padding-top:72px}}

/* Mobile audit: reserve a separate row for closing long-titled dialogs. */
@media(max-width:480px){
  .spot-dialog__top{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
  .spot-dialog__close{grid-row:1;justify-self:end}
  .spot-dialog__title{grid-row:2;min-width:0;font-size:clamp(30px,calc(12.5vw - 10px),35px)}
  .spot-dialog__mask{max-width:100%;overflow-wrap:anywhere}
}