/* Negin Shahr | supplied campaigns + compact shared footer.
   Isolated selectors: no product-card, typography, category-grid, or palette redesign. */
.ng-announcement{background:var(--vt-gradient-dark,linear-gradient(115deg,#27205F,#5A216D));color:#fff;min-height:48px;display:flex;align-items:center;justify-content:center;padding:8px 16px;box-sizing:border-box}
.ng-announcement p{margin:0;display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;font-size:13px;line-height:1.7;font-weight:600;text-align:center}
.ng-announcement__extra{padding-inline-start:20px;border-inline-start:1px solid rgba(255,255,255,.22);color:#edeaf7;font-size:12px}
.ng-banner-section{box-sizing:border-box;width:100%;max-width:1472px;margin-inline:auto;padding-inline:16px;margin-bottom:40px}
.ng-home-hero{margin-top:160px;padding-top:16px;margin-bottom:0}
.ng-banner__link{display:block;overflow:hidden;border-radius:24px;background:#faf9f6;box-shadow:0 10px 30px rgba(39,32,95,.06);line-height:0;text-decoration:none}
.ng-banner__picture{display:block;position:relative;overflow:hidden;aspect-ratio:var(--ng-frame-ratio)}
.ng-banner__image{display:block;position:absolute;left:var(--ng-art-left,0);top:var(--ng-art-top,0);width:var(--ng-art-width,100%)!important;max-width:none!important;height:auto!important;aspect-ratio:1916 / 821;object-fit:contain!important;border:0}
.ng-banner__link:focus-visible{outline:3px solid #DB176C;outline-offset:4px}
.ng-footer{direction:rtl;margin:40px 16px 0;border-radius:32px 32px 0 0;background:var(--vt-gradient-dark,linear-gradient(115deg,#27205F,#5A216D));color:#fff;box-sizing:border-box;overflow:hidden;font-family:inherit}
.ng-footer *, .ng-footer *::before, .ng-footer *::after{box-sizing:border-box}
.ng-footer__inner{max-width:1472px;margin-inline:auto;padding:28px 32px 18px}
.ng-footer__grid{display:grid;grid-template-columns:1fr 1.45fr .9fr;gap:32px;align-items:start}
.ng-footer__grid>*{min-width:0}
.ng-footer a{color:inherit;text-decoration:none;transition:color .18s ease}
.ng-footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.ng-footer a:focus-visible,.ng-footer button:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:6px}
.ng-footer__brand-link{display:flex;align-items:center;gap:12px}
.ng-footer__logo{display:block;width:52px!important;height:52px!important;max-width:52px!important;object-fit:cover!important;flex-shrink:0;border-radius:12px;border:1px solid rgba(255,255,255,.24)}
.ng-footer__brand-link strong{display:block;font-size:24px;line-height:1.25;font-weight:800;color:#fff}
.ng-footer__descriptor{display:block;color:#ded9ef;font-size:11px;line-height:1.9;margin-top:3px}
.ng-footer__brand p{font-size:12px;color:#ded9ef;line-height:1.9;margin:12px 0 4px}
.ng-footer__social{display:flex;align-items:center;flex-wrap:wrap;gap:18px}
.ng-footer__social a{min-height:36px;display:inline-flex;align-items:center;font-size:12px;color:#e5e1f2}
.ng-footer h2{color:#fff;font-size:14px;line-height:1.8;margin:0 0 10px;font-weight:700}
.ng-footer address{font-style:normal;font-size:13px;line-height:2;color:#e5e1f2;margin:0}
.ng-footer__hours{font-size:12px;line-height:1.9;color:#ded9ef;margin:6px 0 4px}
.ng-footer__hours span{white-space:nowrap}
.ng-footer .ng-footer__phone{font-size:18px;font-weight:700;line-height:1.8;color:#fff;display:inline-flex;align-items:center;min-height:36px}
.ng-footer__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:0}
.ng-footer__links a{font-size:12px;line-height:1.8;color:#e5e1f2;display:flex;align-items:center;min-height:36px}
.ng-footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16)}
.ng-footer__bottom p,.ng-footer__bottom small{font-size:11px;line-height:1.8;margin:0;color:#ded9ef}
.ng-footer__bottom p span{padding-inline:4px;color:#d9cdec}
.ng-footer__to-top{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;color:#fff;background:transparent;border:0;font:inherit;font-size:11px;min-height:36px;padding:4px 0;cursor:pointer}
@media(max-width:1023px){
 .ng-home-hero{margin-top:0;padding-top:12px}
 .ng-announcement{min-height:32px;padding:5px 12px}
 .ng-announcement--inset{margin-inline:-16px;margin-top:-17px;margin-bottom:4px}
 .ng-announcement p{font-size:12px;line-height:1.8;gap:0}
 .ng-announcement__extra{display:none}
 .ng-footer__grid{gap:24px;grid-template-columns:1fr 1.3fr}
 .ng-footer__nav{grid-column:1/-1}
 .ng-footer__nav h2{display:none}
 .ng-footer__links{display:flex;flex-wrap:wrap;gap:8px 24px}
}
@media(max-width:767px){
 .ng-banner__link{border-radius:16px}
 .ng-footer{border-radius:24px 24px 0 0}
 .ng-footer__inner{padding:22px 20px 16px}
 .ng-footer__grid{grid-template-columns:1fr;gap:16px}
 .ng-footer__brand-link strong{font-size:22px}
 .ng-footer__brand p{margin:8px 0 0}
 .ng-footer__social{gap:22px}
 .ng-footer h2{margin-bottom:6px;font-size:13px}
 .ng-footer address{font-size:12px}
 .ng-footer__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
 .ng-footer__links a,.ng-footer__social a{min-height:40px}
 .ng-footer__bottom{display:grid;grid-template-columns:1fr auto;gap:6px 8px;margin-top:12px;padding-top:12px}
 .ng-footer__bottom>p{grid-column:1/-1;font-size:10px}
 .ng-footer__bottom small{font-size:10px}
 .ng-footer__to-top{min-height:40px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){.ng-footer a{transition:none}}

/* Compact campaign windows: preserve the supplied artwork and its aspect ratio. */
.ng-banner-section[data-ng-banner="everyday"]{--ng-frame-ratio:1916 / 600;--ng-art-width:100.00000000%;--ng-art-left:0.00000000%;--ng-art-top:-6.00000000%;}
.ng-banner-section[data-ng-banner="school"]{--ng-frame-ratio:1916 / 479;--ng-art-width:100.00000000%;--ng-art-left:0.00000000%;--ng-art-top:-60.54279749%;}
.ng-banner-section[data-ng-banner="creative"]{--ng-frame-ratio:1611 / 403;--ng-art-width:118.93234016%;--ng-art-left:-18.93234016%;--ng-art-top:-41.68734491%;}
@media(max-width:767px){
.ng-banner-section[data-ng-banner="everyday"]{--ng-frame-ratio:1396 / 698;--ng-art-width:137.24928367%;--ng-art-left:-37.24928367%;--ng-art-top:0.00000000%;}
.ng-banner-section[data-ng-banner="school"]{--ng-frame-ratio:1532 / 479;--ng-art-width:125.06527415%;--ng-art-left:-19.25587467%;--ng-art-top:-59.70772443%;}
.ng-banner-section[data-ng-banner="creative"]{--ng-frame-ratio:1456 / 455;--ng-art-width:131.59340659%;--ng-art-left:-23.00824176%;--ng-art-top:-28.13186813%;}
}

/* Desktop-only compact banners — revision 3.
   Same original artwork, full content width and unchanged mobile/tablet rules.
   At the 1440px content cap: hero ~301px; middle campaigns ~251px.
   Source crop windows are documented in BANNER-FRAMES.json.
*/
@media (min-width:1024px){
 .ng-banner-section[data-ng-banner="everyday"]{
  --ng-frame-ratio:1916 / 400;
  --ng-art-width:100.00000000%;
  --ng-art-left:0.00000000%;
  --ng-art-top:-12.50000000%;
 }
 .ng-banner-section[data-ng-banner="school"]{
  --ng-frame-ratio:1916 / 334;
  --ng-art-width:100.00000000%;
  --ng-art-left:0.00000000%;
  --ng-art-top:-91.01796407%;
 }
 .ng-banner-section[data-ng-banner="creative"]{
  --ng-frame-ratio:1916 / 334;
  --ng-art-width:100.00000000%;
  --ng-art-left:0.00000000%;
  --ng-art-top:-55.08982036%;
 }
}
/* In the narrow creative window the source logo's small caption reaches the
   top-left crop edge. Fill only that corner with a nearby clear texture from
   the SAME supplied image; the main headline/artwork is untouched. */
@media (min-width:1024px){
 .ng-banner-section[data-ng-banner="creative"] .ng-banner__picture::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:18%;
  height:11%;
  background-image:url('./img/campaigns/ng-creative-desktop-1916.webp');
  background-repeat:no-repeat;
  background-size:555.55555556% auto;
  background-position:0 27.17393043%;
  -webkit-mask-image:linear-gradient(to bottom,#000 50%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 50%,transparent 100%);
  pointer-events:none;
 }
}