/* ============================================================================
   PESTONICS — brand bridge over the AB Design System   (v2, light-only)
   ----------------------------------------------------------------------------
   The AB master sits inside `@layer ab-design-system`. THIS FILE IS UNLAYERED,
   so every rule here beats the master regardless of specificity. Never wrap it
   in a layer; always load it AFTER ab-design-system.css.

   Owner direction (2026-09-10): "light design, different colour card
   combination, gradient colour like 4ab.in". So: AB navy structure, AB's own
   six tints + vivid gradients, light theme only. Pestonics' raspberry #C93465
   (their live theme colour; the logo is a black badge + pink mark) is kept in
   the ACCENT role — kicker rule, hairlines, the call pill — so the brand still
   reads as theirs inside 4ab.in's design language.
   ========================================================================== */

/* ---------------------------------------------------------------- 1. TOKENS */
:root, .ab-page {
  --wrap: 1200px;                 /* 1360 on the origin; narrower here so the
                                     desktop floater fits the side margin at 1440 */
  /* raspberry takes the accent role the gold plays on 4ab.in */
  --gold:        #C93465;
  --gold-soft:   #F6C1D3;         /* accent text ON navy — 11:1 on #1B2A5E */
  --gold-ring:   #C93465;
  --gold-ink:    #A02650;         /* 7.4:1 on white — the only raspberry text on light */
  --tint:        rgba(201, 52, 101, .12);
  --sheen:       rgba(201, 52, 101, .05);
  --hair-gold:   rgba(201, 52, 101, .45);
  --glow-1:      rgba(201, 52, 101, .16);
  --focus-ring:  var(--gold-ink);
  --grad-step:   linear-gradient(90deg, #E86A96, #A02650);
  /* everything else — navy panels, six tints, the blue→pink and orange→yellow
     gradients, the eight hues — is AB stock and comes from the master. */
  --pn-wa: #25D366;
  --pn-wa-ink: #062B12;
}

/* Light-only. The master's media-guarded dark block would flip the palette on a
   dark-OS phone; the owner asked for light, so pin it. */
:root { color-scheme: light; }
html[data-theme] { color-scheme: light; }

/* ------------------------------------------------------- 2. AB PACKAGE BUGS
   Documented defects in the shared master. Do NOT tidy these away.
   (a) `.ab-base a, .ab-page a{color:var(--navy)}` is (0,1,1) and beats every
       button variant at (0,1,0) — anchor-buttons render navy-on-navy.
   (b) `.ab-btn--gold` hard-codes an orange glow no token reaches — fine here,
       we keep the 4ab.in orange CTA, but the call pill below is raspberry.
   (c) There is no skip-link class in the master at all. */
a.ab-btn--gold,  a.ab-btn--gold:hover,
a.ab-btn--navy,  a.ab-btn--navy:hover  { color:#fff; }
a.ab-btn--ghost, a.ab-btn--ghost:hover { color: var(--gold-soft); }
a.ab-btn--line,  a.ab-btn--line:hover  { color: var(--navy); }
a.ab-credit__site { color: var(--gold-soft); }

.ab-skip{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.ab-skip:focus{ left:12px; top:12px; z-index:200; width:auto; height:auto;
  padding:12px 18px; border-radius:10px; background:var(--gold); color:#fff; font-weight:700; }

/* Prefer the blue→pink primary for in-page buttons (4ab.in's Call pill); the
   orange→yellow --grad-cta stays for the closing CTA block, as on the origin. */
.ab-btn--primary{ background:var(--grad-primary); color:#fff; border:0;
  box-shadow:0 8px 22px var(--grad-primary-glow); text-shadow:0 1px 2px rgba(0,0,0,.25); }
a.ab-btn--primary, a.ab-btn--primary:hover{ color:#fff; }
.ab-btn--wa{ background:linear-gradient(90deg,#2EE07A,#1FA855); color:var(--pn-wa-ink); border:0;
  box-shadow:0 8px 22px rgba(37,211,102,.32); }
a.ab-btn--wa, a.ab-btn--wa:hover{ color:var(--pn-wa-ink); }

/* -------------------------------------------------------------- 3. CALL BAR
   astrology.4ab.in's floating "talk to us" pair.
   PC   ≥1760px: the full labelled pills, 250px, docked bottom-right — there is
                 ≥280px of side margin beside a 1200px wrap, so nothing overlaps.
   PC   761–1759: COMPACT — 56px round icon buttons; the label slides out on
                 hover/focus. At 1440 the margin is only 120px, and the full pill
                 was measured sitting ON TOP of the aside buttons and the footer
                 address. This is the fix.
   Phone ≤760:   full-width foot bar, Call + WhatsApp only, always visible
                 (the phone IS the conversion on this site). */
.pn-bar{ position:fixed; z-index:60; font-family:var(--font-nav); }
.pn-bar a{ display:flex; align-items:center; gap:10px; text-decoration:none;
  border-radius:999px; padding:11px 16px; font-weight:700; line-height:1.15;
  box-shadow:0 8px 22px rgba(13,23,64,.28); transition:transform .15s, filter .15s, width .2s; }
.pn-bar a small{ display:block; font-weight:500; font-size:11px; opacity:.88; letter-spacing:.02em; }
.pn-bar a:active{ transform:translateY(1px); filter:brightness(.95); }
.pn-bar svg{ width:20px; height:20px; flex:0 0 auto; fill:currentColor; }
.pn-bar .pn-call{ background:var(--deep-navy-grad); color:#fff; border:1px solid var(--hair-gold); }
.pn-bar .pn-call:hover{ color:#fff; filter:brightness(1.12); }
.pn-bar .pn-wa{ background:var(--pn-wa); color:var(--pn-wa-ink); }
.pn-bar .pn-wa:hover{ background:#1FBE5A; color:var(--pn-wa-ink); }

@media (min-width:761px){
  .pn-bar{ right:18px; bottom:18px; display:flex; flex-direction:column; gap:10px; align-items:flex-end; }
  .pn-bar a{ width:250px; }
}
@media (min-width:761px) and (max-width:1759.98px){
  .pn-bar a{ width:56px; height:56px; padding:0 0 0 18px; overflow:hidden; white-space:nowrap; }
  .pn-bar a span{ opacity:0; transition:opacity .15s; }
  .pn-bar a:hover, .pn-bar a:focus-visible{ width:250px; padding:11px 16px; }
  .pn-bar a:hover span, .pn-bar a:focus-visible span{ opacity:1; }
}
@media (max-width:760px){
  .pn-bar{ left:0; right:0; bottom:0; display:flex; gap:8px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));
    background:rgba(13,23,64,.94); backdrop-filter:blur(6px); }
  .pn-bar a{ flex:1 1 0; justify-content:center; padding:10px 8px; font-size:14px; border-radius:13px; }
  .pn-bar a small{ font-size:10px; }
  body{ padding-bottom:78px; }
}
@media print{ .pn-bar{ display:none !important; } }

/* --------------------------------------------------------------- 4. HEADER */
.pn-topbar{ background:var(--panel-2); color:#C9D0E2; font-size:13.5px; font-family:var(--font-nav); }
.pn-topbar a{ color:#fff; text-decoration:none; font-weight:600; }
.pn-topbar a:hover{ color:var(--gold-soft); }
.pn-topbar__in{ max-width:var(--wrap); margin:0 auto; padding:0 24px; display:flex;
  align-items:center; justify-content:space-between; gap:18px; min-height:40px; flex-wrap:wrap; }
.pn-topbar__set{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
@media (max-width:760px){ .pn-topbar__set--hide{ display:none; } }

.pn-hdr{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.6) blur(10px); border-bottom:1px solid var(--line); }
.pn-hdr__in{ max-width:var(--wrap); margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:16px; min-height:76px; }
.pn-brand{ display:flex; align-items:center; margin-right:auto; flex-shrink:0; }
.pn-logo{ height:46px; width:auto; }
.pn-nav{ display:flex; align-items:center; gap:2px; font-family:var(--font-nav); }
.pn-nav>a, .pn-has>button{ padding:9px 13px; border-radius:999px; text-decoration:none; color:var(--nav-c);
  font:inherit; font-weight:600; font-size:15.5px; white-space:nowrap; background:none; border:0; cursor:pointer;
  display:flex; align-items:center; gap:6px; }
.pn-nav>a:hover, .pn-has>button:hover, .pn-has[data-open="true"]>button{ background:var(--tint); color:var(--gold-ink); }
.pn-nav>a[aria-current="page"]{ background:var(--tint); color:var(--gold-ink); }
.pn-nav__cta{ margin-left:8px; padding:10px 20px !important; }
.pn-has{ position:relative; }
.pn-has>button svg{ transition:transform .2s; }
.pn-has[data-open="true"]>button svg{ transform:rotate(180deg); }
.pn-menu{ position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%);
  background:var(--card); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-lift); padding:10px; display:none;
  grid-template-columns:repeat(2,minmax(200px,1fr)); gap:4px; }
.pn-has[data-open="true"] .pn-menu{ display:grid; }
.pn-menu a{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px;
  font-size:15px; font-weight:600; color:var(--body-c); text-decoration:none; white-space:nowrap; }
.pn-menu a:hover{ background:var(--tint); color:var(--gold-ink); }
.pn-menu a i{ font-style:normal; font-size:18px; width:22px; text-align:center; }

.pn-burger{ display:none; width:46px; height:46px; padding:0; cursor:pointer; border:1px solid var(--line);
  background:#fff; border-radius:11px; align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.pn-burger span{ display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:.22s; }
.pn-burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.pn-burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.pn-burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Rule 7 — mobile drawer: 3 tinted tiles per row, big icon above the label */
@media (max-width:1100px){
  .pn-nav, .pn-has{ display:none; }
  .pn-burger{ display:flex; }
  .pn-nav.is-open{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; align-content:start;
    position:fixed; inset:76px 0 0; background:var(--paper); padding:16px; overflow-y:auto; border-top:1px solid var(--line); }
  .pn-nav.is-open>a, .pn-nav.is-open .pn-has{ display:block; }
  .pn-nav.is-open>a, .pn-nav.is-open .pn-has>button{ min-height:96px; padding:14px 8px; border-radius:var(--r-md);
    flex-direction:column; justify-content:center; text-align:center; font-size:14px; width:100%;
    border:1px solid var(--line); }
  .pn-nav.is-open>a:nth-child(1){ background:var(--tint-1-bg); border-color:var(--tint-1-line); }
  .pn-nav.is-open .pn-has:nth-of-type(1)>button{ background:var(--tint-2-bg); border-color:var(--tint-2-line); }
  .pn-nav.is-open .pn-has:nth-of-type(2)>button{ background:var(--tint-3-bg); border-color:var(--tint-3-line); }
  .pn-nav.is-open .pn-has:nth-of-type(3)>button{ background:var(--tint-4-bg); border-color:var(--tint-4-line); }
  .pn-nav.is-open>a[href="contact.html"]{ background:var(--tint-5-bg); border-color:var(--tint-5-line); }
  .pn-nav.is-open .pn-nav__cta{ background:var(--grad-cta); color:#fff; border:0; margin:0; }
  .pn-nav.is-open .pn-has>button svg{ display:none; }
  .pn-nav.is-open .pn-has>button::before{ content:attr(data-ico); font-size:28px; display:block; margin-bottom:6px; }
  .pn-nav.is-open>a::before{ content:attr(data-ico); font-size:28px; display:block; margin-bottom:6px; }
  .pn-nav.is-open .pn-menu{ position:static; transform:none; display:none; grid-column:1 / -1;
    grid-template-columns:repeat(3,1fr); gap:8px; box-shadow:none; border:0; padding:6px 0 10px;
    border-bottom:2px solid var(--hair-gold); margin-bottom:4px; background:transparent; }
  .pn-nav.is-open .pn-has[data-open="true"] .pn-menu{ display:grid; }
  .pn-nav.is-open .pn-menu a{ flex-direction:column; text-align:center; white-space:normal; font-size:13px;
    padding:12px 6px; min-height:84px; justify-content:center; border:1px solid var(--line); background:var(--card); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+1){ background:var(--tint-1-bg); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+2){ background:var(--tint-2-bg); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+3){ background:var(--tint-3-bg); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+4){ background:var(--tint-4-bg); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+5){ background:var(--tint-5-bg); }
  .pn-nav.is-open .pn-menu a:nth-child(6n+6){ background:var(--tint-6-bg); }
  .pn-nav.is-open .pn-menu a i{ font-size:24px; width:auto; }
}

/* ----------------------------------------------------------- 5. PAGE PARTS */
/* compact hero — the AB recipe for secondary pages */
.pn-hero .ab-hero__panel{ text-align:center; padding:clamp(28px,4vw,46px) clamp(26px,6vw,84px);
  background:radial-gradient(720px 300px at 50% -35%, rgba(201,52,101,.38), transparent 62%), var(--deep-navy-grad); }
.pn-hero .ab-kicker{ justify-content:center; }
.pn-hero .ab-kicker::after{ content:""; width:34px; height:1.5px; background:var(--gold); }
.pn-hero .ab-hero__lede{ text-align:center; margin-left:auto; margin-right:auto; max-width:64ch; }
.pn-hero .ab-hero__title{ font-size:var(--fs-5); }
.pn-crumb{ font-family:var(--font-nav); font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  color:#B9C2DA; margin:0 0 14px; }
.pn-crumb a{ color:#DCE2F2; text-decoration:none; }
.pn-crumb a:hover{ color:#fff; }

/* home hero — full recipe, left aligned, with the raspberry glow */
.pn-hero--home .ab-hero__panel{ text-align:left;
  background:radial-gradient(900px 420px at 85% -20%, rgba(201,52,101,.42), transparent 60%),
             radial-gradient(600px 300px at 0% 110%, rgba(37,99,235,.28), transparent 60%),
             var(--deep-navy-grad); }
.pn-hero--home .ab-hero__lede{ text-align:left; margin-left:0; }
.pn-hero__cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }

/* Rule 6 — bare icons with a hue glow, no chip */
.pn-ico{ font-size:38px; line-height:1; margin-bottom:14px; display:inline-block;
  filter:drop-shadow(0 0 12px var(--pn-hue, rgba(201,52,101,.55))); }
.ab-tint-1 .pn-ico{ --pn-hue: rgba(217,119,6,.55); }
.ab-tint-2 .pn-ico{ --pn-hue: rgba(37,99,235,.55); }
.ab-tint-3 .pn-ico{ --pn-hue: rgba(22,163,74,.55); }
.ab-tint-4 .pn-ico{ --pn-hue: rgba(124,58,237,.55); }
.ab-tint-5 .pn-ico{ --pn-hue: rgba(13,148,136,.55); }
.ab-tint-6 .pn-ico{ --pn-hue: rgba(219,39,119,.55); }
.ab-card .pn-more{ display:inline-block; margin-top:12px; font-family:var(--font-nav); font-weight:700;
  font-size:14px; color:var(--gold-ink); }
.ab-card--link{ position:relative; }
.ab-card__link{ position:absolute; inset:0; border-radius:inherit; text-indent:-9999px; overflow:hidden; }

/* Rule 4 — dot-pill rail */
.pn-pills{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0 0 6px; }
.pn-pills li{ margin:0; }
.pn-pills a{ display:inline-flex; align-items:center; gap:9px; padding:8px 16px; border:1px solid var(--line);
  border-radius:999px; background:var(--card); font-family:var(--font-nav); font-size:13.5px; font-weight:500;
  color:var(--ink); text-decoration:none; transition:border-color .15s, transform .15s; }
.pn-pills a::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--pn-dot,var(--hue-blue)); flex:0 0 auto; }
.pn-pills li:nth-child(8n+1) a{ --pn-dot:var(--hue-gold); }   .pn-pills li:nth-child(8n+2) a{ --pn-dot:var(--hue-blue); }
.pn-pills li:nth-child(8n+3) a{ --pn-dot:var(--hue-green); }  .pn-pills li:nth-child(8n+4) a{ --pn-dot:var(--hue-purple); }
.pn-pills li:nth-child(8n+5) a{ --pn-dot:var(--hue-teal); }   .pn-pills li:nth-child(8n+6) a{ --pn-dot:var(--hue-rose); }
.pn-pills li:nth-child(8n+7) a{ --pn-dot:var(--hue-orange); } .pn-pills li:nth-child(8n+8) a{ --pn-dot:var(--hue-cyan); }
.pn-pills a:hover{ border-color:var(--gold); transform:translateY(-1px); }

/* two-column body: panel + sticky aside */
.pn-split{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:32px; align-items:start; }
.pn-aside{ position:sticky; top:96px; display:grid; gap:16px; }
.pn-aside .ab-card h3{ margin-top:0; }
.pn-aside .ab-btn{ width:100%; justify-content:center; margin-top:10px; }
.pn-aside__list{ list-style:none; padding:0; margin:0; }
.pn-aside__list li{ margin:0 0 6px; }

/* content images: framed, never stretched past their native width */
.pn-fig{ margin:0 0 26px; }
.pn-fig img{ border-radius:var(--r-md); border:1px solid var(--line); box-shadow:var(--shadow-soft);
  width:auto; max-width:min(100%, 560px); height:auto; }
.pn-fig figcaption{ font-family:var(--font-nav); font-size:13px; color:var(--muted); margin-top:8px; }
.pn-figrow{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; margin:0 0 26px; }
.pn-figrow .pn-fig{ margin:0; }
.pn-figrow img{ width:100%; max-width:none; aspect-ratio:4/3; object-fit:cover; }

/* tables */
.pn-table{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-md); margin:0 0 26px; }
.pn-table table{ border-collapse:collapse; width:100%; min-width:460px; font-size:15.5px; }
.pn-table th,.pn-table td{ padding:13px 16px; text-align:left; border-bottom:1px solid var(--line); }
.pn-table th{ background:var(--paper); font-family:var(--font-nav); font-weight:700; color:var(--ink); white-space:nowrap; }
.pn-table tr:last-child td{ border-bottom:0; }
.pn-table td:first-child{ font-variant-numeric:tabular-nums; }

/* product / oil cards */
.pn-prod{ margin:0 0 26px; }
.pn-prod .ab-card h3{ margin-top:0; }
.pn-variants{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 0; }
.pn-variants span{ font-family:var(--font-nav); font-size:12.5px; font-weight:600; padding:5px 11px;
  border-radius:999px; background:var(--grad-chip); color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.25); }
.pn-muted{ color:var(--muted); }
.pn-small{ font-size:14px; }

/* client logo wall */
.pn-logos{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; list-style:none; padding:0; margin:0; }
.pn-logos li{ border:1px solid var(--line); border-radius:var(--r-sm); background:var(--card); aspect-ratio:5/3;
  display:flex; align-items:center; justify-content:center; padding:15px; margin:0; transition:transform .18s, box-shadow .18s; }
.pn-logos li:hover{ transform:translateY(-3px); box-shadow:var(--shadow-soft); }
.pn-logos img{ max-height:100%; width:auto; object-fit:contain; filter:grayscale(1); opacity:.66; transition:.2s; }
.pn-logos li:hover img{ filter:none; opacity:1; }

/* contact reach cards */
.pn-reach__card{ text-decoration:none; display:block; }
.pn-reach__card h3{ margin-top:0; margin-bottom:6px; }
.pn-reach__card p{ color:var(--body-c); margin:0; text-align:left; }

/* team faces */
.pn-face{ width:88px; height:88px; border-radius:50%; object-fit:cover; border:3px solid #fff;
  box-shadow:var(--shadow-soft); margin-bottom:12px; }

/* form */
.pn-form{ display:grid; gap:16px; max-width:640px; }
.pn-field label{ display:block; font-family:var(--font-nav); font-weight:700; font-size:14px; color:var(--ink); margin-bottom:6px; }
.pn-field input,.pn-field textarea{ width:100%; font:inherit; font-size:16px; padding:13px 15px;
  border:1.5px solid var(--line); border-radius:var(--r-sm); background:#fff; color:var(--ink); }
.pn-field input:focus,.pn-field textarea:focus{ border-color:var(--gold); outline:none; box-shadow:0 0 0 3px var(--tint); }
.pn-req{ color:#DC2626; }
.pn-hp{ position:absolute; left:-9999px; }

/* site footer (above the Rule-8 credit bar) */
.pn-ftr{ background:var(--panel-2); color:#B9C2DA; padding:56px 0 40px; font-size:15px; margin-top:clamp(64px,9vw,110px); }
.pn-ftr__in{ max-width:var(--wrap); margin:0 auto; padding:0 24px; }
.pn-ftr h4{ color:#fff; font-family:var(--font-nav); font-size:13.5px; letter-spacing:.12em; text-transform:uppercase; margin:0 0 15px; }
.pn-ftr a{ color:#B9C2DA; text-decoration:none; }
.pn-ftr a:hover{ color:var(--gold-soft); }
.pn-ftr__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.4fr; gap:34px; }
.pn-ftr ul{ list-style:none; padding:0; margin:0; }
.pn-ftr li{ margin-bottom:9px; }
.pn-ftr__logo{ height:48px; width:auto; margin-bottom:15px; }
.pn-ftr p{ text-align:left; }
.ab-credit{ margin-top:0; }

/* section helpers */
.pn-s{ margin-top:clamp(48px,7vw,80px); }
.pn-center{ text-align:center; }
.pn-center .ab-eyebrow{ justify-content:center; }
.pn-center .ab-ruled::after{ left:50%; transform:translateX(-50%); }

@media (max-width:1100px){
  .pn-split{ grid-template-columns:1fr; }
  .pn-aside{ position:static; }
  .pn-ftr__grid{ grid-template-columns:1fr 1fr; gap:28px; }
}
@media (max-width:720px){ .pn-ftr__grid{ grid-template-columns:1fr; } }

/* ============================================================ 6. OWNER ROUND 1 (2026-09-10)
   "PC pe full width, mobile pe koi left/right white space nahi, har page pe hero full
   width; pills PC pe ek line; mobile pe Call + WhatsApp hamesha ek row; mobile footer
   Services|Company ek row + separator; dono address alag colour cards; branding hatao;
   mobile menu hero ke peeche ja raha hai." */

/* hero = full-bleed on every page; the copy stays on the 1200px column */
body{ overflow-x:clip; }
.pn-hero{ margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); width:100vw; }
.pn-hero .ab-hero__panel{ border-radius:0;
  padding-left:max(24px, calc((100vw - var(--wrap)) / 2 + 24px));
  padding-right:max(24px, calc((100vw - var(--wrap)) / 2 + 24px)); }
.pn-hero .ab-hero__panel::after{ border-radius:0; }
@media (max-width:760px){
  .pn-hero .ab-hero__panel{ padding-left:18px; padding-right:18px; }
}

/* chips + buttons: one line on PC; Call + WhatsApp one row ALWAYS on phone */
.pn-hero__row{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; margin-top:24px; }
.pn-hero__row .ab-hero__meta{ margin:0; }
.pn-hero__row .pn-hero__cta{ margin:0; flex-wrap:nowrap; }
@media (min-width:1100px){ .pn-hero__row{ flex-wrap:nowrap; } .pn-hero__row .ab-hero__meta{ flex-wrap:nowrap; } }
@media (max-width:760px){
  .pn-hero__row .pn-hero__cta{ width:100%; }
  .pn-hero__row .pn-hero__cta .ab-btn{ flex:1 1 0; min-width:0; padding-left:10px; padding-right:10px; font-size:14px; justify-content:center; }
  .ab-cta__row{ flex-wrap:nowrap; }
  .ab-cta__row .ab-btn{ flex:1 1 0; min-width:0; padding-left:10px; padding-right:10px; font-size:14px; justify-content:center; }
}

/* mobile drawer above everything, including the hero's stacking context */
.pn-hdr{ z-index:1000; }
.pn-nav.is-open{ z-index:1001; }

/* footer: the two addresses are tinted cards (light on navy), any width */
.pn-addr{ border-radius:14px; padding:12px 14px; margin:0 0 12px; color:var(--ink); }
.pn-addr b{ display:block; font-family:var(--font-nav); font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:4px; }
.pn-addr p{ margin:0; color:var(--body-c); font-size:14.5px; line-height:1.5; }
.pn-addr--corp{ background:var(--tint-2-bg); border:1px solid var(--tint-2-line); }
.pn-addr--corp b{ color:var(--hue-blue); }
.pn-addr--branch{ background:var(--tint-6-bg); border:1px solid var(--tint-6-line); }
.pn-addr--branch b{ color:var(--hue-rose); }
.pn-ftr__bar{ margin:36px 0 0; padding-top:18px; border-top:1px solid rgba(255,255,255,.12);
  font-family:var(--font-nav); font-size:13.5px; color:#8F9BB8; text-align:center; }

/* mobile footer: Services | Company side by side with a separator */
@media (max-width:720px){
  .pn-ftr__grid{ grid-template-columns:1fr 1fr; gap:22px 0; }
  .pn-ftr__grid > div:first-child, .pn-ftr__col--reach{ grid-column:1 / -1; }
  .pn-ftr__col--services{ padding-right:14px; border-right:1px solid rgba(255,255,255,.18); }
  .pn-ftr__col--company{ padding-left:16px; }
  .pn-ftr li{ font-size:14.5px; }
}

/* --- round 1 fixes after measuring ---
   (1) the master caps .ab-hero at the wrap width; release it so the negative
       margins actually produce a full-bleed band.
   (2) backdrop-filter on the sticky header makes it the CONTAINING BLOCK for the
       fixed drawer, so `inset:76px 0 0` resolves inside a 76px-tall box → the
       drawer is 0px tall and clipped ("menu hero ke peeche ja raha hai"). No
       backdrop-filter where the drawer exists. */
.pn-hero{ width:auto; max-width:none; }
@media (max-width:1100px){
  .pn-hdr{ backdrop-filter:none; background:#fff; }
  .pn-nav.is-open{ top:76px; bottom:0; left:0; right:0; height:auto; }
}
/* logos that arrive as page "images" (about.html) — a small wall, not photos */
.pn-logos--sm{ grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:10px; margin:0 0 22px; }
.pn-logos--sm li{ padding:10px; aspect-ratio:3/2; }

/* --- audit P0/P1 fixes (2026-09-10) ---
   figures never crop: the 4:3 cover was cutting 40% off 180×64 logos and the
   1200×450 IPM diagram. Justified prose gets hyphenation. 44px tap targets. */
.pn-figrow img{ aspect-ratio:auto; object-fit:contain; width:100%; max-width:none; }
.ab-panel p, .ab-panel li{ hyphens:auto; -webkit-hyphens:auto; }
@media (max-width:760px){
  .pn-pills a{ min-height:44px; }
  .pn-menu a, .pn-aside__list a{ min-height:44px; display:flex; align-items:center; }
}

/* hero is now a full-bleed band OUTSIDE .ab-wrap (build.js v5). The master pads
   .ab-hero and rounds the panel — both off here; the copy aligns to the 1200px
   column through the panel's own padding. */
.pn-hero{ margin:0; padding:0; width:auto; max-width:none; }
.pn-hero .ab-hero__panel{ margin:0; border-radius:0; }
.pn-hero + .ab-wrap > .ab-s:first-child, .pn-hero + .ab-wrap > .pn-s:first-child{ margin-top:clamp(40px,6vw,72px); }

/* owner 2026-09-10: "pills har jagah ek row mein two column" — every dot-pill
   rail is a 2-column grid, pills fill their cell. */
.pn-pills{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.pn-pills li{ min-width:0; }
.pn-pills a{ display:flex; width:100%; box-sizing:border-box; }

/* owner 2026-09-10: "hero ka text bhi hamesha full width" — no ch cap, no
   column inset; the copy runs the full band with a small gutter. */
.pn-hero .ab-hero__panel{ padding-left:clamp(20px,4vw,64px); padding-right:clamp(20px,4vw,64px); }
.pn-hero .ab-hero__lede, .pn-hero--home .ab-hero__lede{ max-width:none; }
.pn-hero .ab-hero__title, .pn-hero h1{ max-width:none; }

/* owner 2026-09-10: footer — every column is a tinted card; phone + email live
   in the FIRST (brand) column, left. */
.pn-ftr__card{ border-radius:14px; padding:18px 18px 12px; border:1px solid var(--line); color:var(--body-c); }
.pn-ftr__card h4{ color:var(--ink); }
.pn-ftr__card a, .pn-ftr__card p{ color:var(--body-c); }
.pn-ftr__card a:hover{ color:var(--gold-ink); }
.pn-ftr__card--brand{ background:var(--tint-1-bg); border-color:var(--tint-1-line); }
.pn-ftr__card--services{ background:var(--tint-3-bg); border-color:var(--tint-3-line); }
.pn-ftr__card--company{ background:var(--tint-4-bg); border-color:var(--tint-4-line); }
.pn-ftr__contact{ margin-top:12px !important; padding-top:12px; border-top:1px solid var(--line); }
.pn-ftr__contact a{ font-weight:600; color:var(--ink); }
.pn-ftr__col--reach .pn-addr:last-child{ margin-bottom:0; }
.pn-ftr__grid{ align-items:stretch; }
@media (max-width:720px){
  .pn-ftr__col--services{ border-right:0; padding-right:18px; }
  .pn-ftr__col--company{ padding-left:18px; }
  .pn-ftr__grid{ gap:12px; }
}

/* owner: "all rights reserved ke liye nayi line mat lo" — it sits in the free
   space under the address cards, not on its own row. */
.pn-ftr__bar{ margin:14px 0 0; padding:0; border:0; text-align:left; font-size:13px; }
.pn-ftr{ padding-bottom:36px; }

/* owner: home hero centred like the inner pages */
.pn-hero--home .ab-hero__panel{ text-align:center; }
.pn-hero--home .ab-hero__lede{ text-align:center; margin-left:auto; margin-right:auto; }
.pn-hero--home .pn-hero__row{ justify-content:center; }
.pn-hero--home .ab-hero__meta{ justify-content:center; }

/* owner: PC pe 4 per row jab jagah ho — wide rails go 4-up on desktop; the
   340px aside rail stays 2-up. */
@media (min-width:1100px){ .pn-pills{ grid-template-columns:repeat(4,1fr); } .pn-aside .pn-pills{ grid-template-columns:1fr 1fr; } }

/* owner: testimonial quotes — smaller. The master's .ab-quote is a pull-quote
   (--fs-2, justified); three side by side need body size, ragged-right. */
.ab-quote.ab-card{ padding:22px 22px; }
.ab-quote.ab-card p{ font-size:15.5px; line-height:1.6; text-align:left; margin:0; }

/* ---- footer polish (owner: "make this beautiful") ---- */
.pn-ftr__card{ padding:22px 22px 18px; position:relative; overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.18); transition:transform .18s, box-shadow .18s; }
.pn-ftr__card::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--grad-primary); }
.pn-ftr__card--services::before{ background:linear-gradient(90deg,#16A34A,#0D9488); }
.pn-ftr__card--company::before{ background:linear-gradient(90deg,#7C3AED,#EC4899); }
.pn-ftr__card:hover{ transform:translateY(-3px); box-shadow:0 18px 44px rgba(0,0,0,.28); }
.pn-ftr__card h4{ display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.pn-ftr__card h4 i{ font-style:normal; font-size:18px; }
.pn-ftr__logo{ height:52px; margin-bottom:12px; }
.pn-ftr__card--brand p{ font-size:14.5px; line-height:1.6; }
.pn-ftr__card--services li, .pn-ftr__card--company li{ margin:0; }
.pn-ftr__card--services a, .pn-ftr__card--company a{ display:flex; align-items:center; gap:9px; padding:6px 0; font-size:15px; border-bottom:1px dashed var(--line-soft); }
.pn-ftr__card--services li:last-child a, .pn-ftr__card--company li:last-child a{ border-bottom:0; }
.pn-ftr__card--services a::before, .pn-ftr__card--company a::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--hue-green); flex:0 0 auto; }
.pn-ftr__card--company a::before{ background:var(--hue-purple); }
.pn-ftr__card--services a:hover, .pn-ftr__card--company a:hover{ padding-left:4px; }
.pn-ftr__contact li{ display:flex; align-items:center; gap:10px; margin:0 0 6px; }
.pn-ftr__contact i{ font-style:normal; font-size:16px; }
.pn-ftr__btns{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.pn-ftr__btns .ab-btn{ min-height:42px; padding:9px 16px; font-size:14px; }
.pn-ftr__col--reach{ display:flex; flex-direction:column; }
.pn-ftr__col--reach .pn-addr{ box-shadow:0 10px 30px rgba(0,0,0,.18); padding:16px 16px 14px; }
.pn-addr a{ display:inline-block; margin-top:8px; font-family:var(--font-nav); font-size:13px; font-weight:700; color:var(--gold-ink); }
.pn-ftr__col--reach .pn-ftr__bar{ margin-top:auto; padding-top:14px; }
.pn-ftr{ background:radial-gradient(900px 300px at 100% 0%, rgba(201,52,101,.18), transparent 60%), var(--panel-2); }

/* header CTA: `.pn-nav>a{background:none;color:var(--nav-c)}` is (0,1,1) and was
   beating `.ab-btn--primary` (0,1,0) — the Call pill rendered white/grey. */
.pn-nav>a.pn-nav__cta, .pn-nav>a.pn-nav__cta:hover{ background:var(--grad-primary); color:#fff;
  box-shadow:0 8px 22px var(--grad-primary-glow); }

/* owner: PC pe dono address ek hi box mein, 50/50, left — the two address
   cards now live inside the brand card, side by side; reach column removed. */
.pn-ftr__grid{ grid-template-columns:1.9fr 1fr 1fr; }
.pn-ftr__addrs{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:16px; }
.pn-ftr__addrs .pn-addr{ margin:0; box-shadow:none; }
.pn-ftr__addrs .pn-ftr__bar{ grid-column:1 / -1; margin-top:4px; text-align:left; color:var(--muted); }
@media (max-width:1100px){ .pn-ftr__grid{ grid-template-columns:1fr 1fr; } .pn-ftr__card--brand{ grid-column:1 / -1; } }
@media (max-width:720px){ .pn-ftr__grid{ grid-template-columns:1fr 1fr; } .pn-ftr__addrs{ grid-template-columns:1fr; } }

/* owner: closing CTA full width on mobile — pull it out of the wrap's 24px gutter */
@media (max-width:760px){
  .ab-cta{ margin-left:-24px; margin-right:-24px; }
  .ab-cta__panel{ border-radius:0; padding-left:18px; padding-right:18px; }
}

/* owner: footer card gaps minimal; on mobile the two addresses stay in one row */
.pn-ftr__grid{ gap:14px; }
.pn-ftr__addrs{ gap:10px; }
@media (max-width:720px){
  .pn-ftr__grid{ gap:10px; }
  .pn-ftr__addrs{ grid-template-columns:1fr 1fr; }
  .pn-ftr__addrs .pn-addr{ padding:12px; }
  .pn-ftr__addrs .pn-addr p{ font-size:13.5px; }
  .pn-ftr__col--services{ padding-right:0; } .pn-ftr__col--company{ padding-left:0; }
}
@media (max-width:760px){ .ab-cta{ padding-left:0; padding-right:0; } }

/* owner: footer full width on PC */
.pn-ftr__in{ max-width:none; padding:0 24px; }

/* owner: pills squarer, auto-sizing, so 2 fit cleanly per row on a phone
   (the first attempt at this never landed — the shell aborted the whole command) */
.pn-pills a{ border-radius:9px; padding:8px 12px; font-size:13.5px; white-space:normal; line-height:1.25; min-height:40px; }
@media (max-width:760px){ .pn-pills{ gap:6px; } .pn-pills a{ padding:7px 9px; font-size:12.5px; gap:7px; } .pn-pills a::before{ width:6px; height:6px; } }

/* owner: "See all clients" fills the empty cells of the logo grid's last row */
.pn-logos__more{ grid-column-end:-1; aspect-ratio:auto; border:0; background:none; padding:0;
  display:flex; align-items:center; justify-content:center; }
.pn-logos__more .ab-btn{ width:100%; justify-content:center; }
/* auto-placement put the tile in the last column only; span both empty cells */
.pn-logos__more{ grid-column:span 2; }

/* owner 2026-09-11, MOBILE ONLY: footer stacked — brand card, then Services,
   then Company each full width; the two offices as one column / two rows; and
   the "DESIGNED BY … || V.n ||" credit bar back (mobile only, as instructed —
   flip the media query to show it on PC too). */
.pn-credit{ display:none; }
@media (max-width:760px){
  .pn-ftr__grid{ grid-template-columns:1fr; gap:12px; }
  .pn-ftr__card--brand, .pn-ftr__col--services, .pn-ftr__col--company{ grid-column:1 / -1; }
  .pn-ftr__addrs{ grid-template-columns:1fr; gap:10px; }
  .pn-ftr__addrs .pn-addr p{ font-size:14.5px; }
  .pn-ftr{ padding-bottom:16px; }
  .pn-credit{ display:flex; margin:0; }
}

/* owner: footer far too tall on PC — tighter everything, smaller type (PC only) */
@media (min-width:761px){
  .pn-ftr{ padding:32px 0 24px; font-size:13.5px; }
  .pn-ftr__card{ padding:16px 16px 12px; }
  .pn-ftr__card h4{ font-size:12px; margin-bottom:8px; }
  .pn-ftr__card h4 i{ font-size:15px; }
  .pn-ftr__logo{ height:38px; margin-bottom:8px; }
  .pn-ftr__card--brand p{ font-size:13px; line-height:1.5; margin-bottom:8px; }
  .pn-ftr__contact{ margin-top:8px !important; padding-top:8px; }
  .pn-ftr__contact li{ margin-bottom:3px; font-size:13.5px; }
  .pn-ftr__btns{ margin-top:8px; gap:8px; }
  .pn-ftr__btns .ab-btn{ min-height:34px; padding:6px 14px; font-size:13px; }
  .pn-ftr__addrs{ margin-top:10px; gap:8px; }
  .pn-ftr__addrs .pn-addr{ padding:10px 12px 8px; }
  .pn-addr b{ font-size:11px; margin-bottom:2px; }
  .pn-addr p{ font-size:12.5px; line-height:1.4; }
  .pn-addr a{ margin-top:4px; font-size:12px; }
  .pn-ftr__addrs .pn-ftr__bar{ margin-top:2px; font-size:12px; }
  .pn-ftr__card--services a, .pn-ftr__card--company a{ padding:3px 0; font-size:13.5px; gap:7px; }
  .pn-ftr__card--services a::before, .pn-ftr__card--company a::before{ width:6px; height:6px; }
  .pn-ftr__grid{ gap:12px; }
}

/* owner: "aisa hi rakho PC pe" — the full labelled astrology-style pair on ALL
   PC widths; the compact icon-only mode (761–1759px) is retired. */
@media (min-width:761px){
  .pn-bar a, .pn-bar a:hover, .pn-bar a:focus-visible{ width:250px; height:auto; padding:11px 16px; overflow:visible; }
  .pn-bar a span{ opacity:1; }
}

/* owner (mobile): Company bullets were touching the card edge — an earlier
   mobile rule zeroed that card's padding; and the footer's side gutter is now
   a hairline. */
@media (max-width:760px){
  .pn-ftr__col--services, .pn-ftr__col--company{ padding:16px 16px 12px; }
  .pn-ftr__card--brand{ padding:16px 16px 12px; }
  .pn-ftr__in{ padding:0 4px; }
}

/* owner: no top bar (phone + WhatsApp strip) on mobile — the foot bar carries both */
@media (max-width:760px){ .pn-topbar{ display:none; } .pn-nav.is-open{ top:76px; } }

/* ======================= MOBILE DRAWER — REBUILT (owner: "bilkul thik karo") =======================
   Rendered open at 375px: the submenu was being laid out INSIDE its parent's grid cell, so the
   cell ballooned and the submenu ran off the right edge. Rulebook Rule 7 structure applied:
   the parent `.pn-has` is `display:contents`, so its button tile and its submenu are separate
   grid items; the submenu spans the whole row and lands directly under the tile's row;
   `grid-auto-flow: row dense` backfills the row; tiles keep size and position when opened. */
@media (max-width:1100px){
  .pn-nav.is-open{ grid-auto-flow:row dense; grid-auto-rows:min-content; padding:14px 12px 24px; gap:10px; }
  .pn-nav.is-open .pn-has{ display:contents; }
  .pn-nav.is-open>a, .pn-nav.is-open .pn-has>button{
    min-height:96px; height:100%; padding:12px 6px; margin:0; width:auto; box-sizing:border-box;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    font-size:13.5px; line-height:1.2; text-align:center; border-radius:var(--r-md);
    border:1px solid var(--line); color:var(--ink); background:var(--card);
  }
  .pn-nav.is-open>a::before, .pn-nav.is-open .pn-has>button::before{
    content:attr(data-ico); font-size:26px; line-height:1; display:block; margin:0 0 4px;
  }
  .pn-nav.is-open .pn-has>button svg{ display:none; }
  /* open parent: colour only — never a size or position change */
  .pn-nav.is-open .pn-has[data-open="true"]>button{ border-color:var(--gold); box-shadow:0 0 0 2px var(--tint) inset, 0 8px 22px var(--glow-1); color:var(--gold-ink); }
  /* the submenu: full row, 3 tiles per row, separator under the group */
  .pn-nav.is-open .pn-menu{
    grid-column:1 / -1; position:static; transform:none; display:none;
    grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
    background:transparent; box-shadow:none; border:0; border-radius:0;
    padding:2px 0 12px; margin:0 0 2px; border-bottom:2px solid var(--hair-gold);
  }
  .pn-nav.is-open .pn-has[data-open="true"] .pn-menu{ display:grid; }
  .pn-nav.is-open .pn-menu a{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
    min-height:84px; padding:10px 6px; text-align:center; white-space:normal; overflow-wrap:anywhere;
    font-size:12px; line-height:1.2; font-weight:600; color:var(--ink);
    border:1px solid var(--line); border-radius:12px;
  }
  .pn-nav.is-open .pn-menu a i{ font-size:22px; line-height:1; width:auto; margin:0; }
  .pn-nav.is-open .pn-menu a[aria-current="page"]{ border-color:var(--gold); color:var(--gold-ink); }
  .pn-nav.is-open .pn-nav__cta{ background:var(--grad-cta) !important; color:#fff !important; border:0; box-shadow:0 8px 22px rgba(249,115,22,.3); }
  .pn-nav.is-open .pn-nav__cta::before{ content:"📞"; }
}

/* owner (mobile only): no Call/WhatsApp buttons in the hero — the foot bar has
   them — and drop the "9 treatments" chip. */
@media (max-width:760px){
  .pn-hero__row .pn-hero__cta{ display:none; }
  .pn-hero--home .ab-hero__meta li:nth-child(3){ display:none; }
  .pn-hero__row{ margin-top:18px; }
}

/* owner (mobile only): the "What we treat" pill rail duplicates the cards
   right below it on the home page — hidden on phones. Aside rails stay. */
@media (max-width:760px){ .pn-pills:not(.pn-aside .pn-pills){ display:none; } .pn-cards, .ab-grid.pn-s{ margin-top:6px !important; } }

/* owner (mobile): no white gap between the CTA block and the footer, and none
   under the footer — the space reserved for the fixed foot bar now lives INSIDE
   the navy credit bar instead of as body padding. */
@media (max-width:760px){
  .ab-cta{ margin-bottom:0; }
  .pn-ftr{ margin-top:0; }
  body{ padding-bottom:0; }
  .pn-credit{ padding-bottom:calc(14px + 72px + env(safe-area-inset-bottom,0px)); }
}

/* owner (mobile): both phone numbers on ONE row with their icons; email below */
@media (max-width:760px){
  .pn-ftr__contact{ display:grid; grid-template-columns:1fr 1fr; gap:6px 8px; }
  .pn-ftr__contact li{ margin:0; min-width:0; }
  .pn-ftr__contact li:nth-child(3){ grid-column:1 / -1; }
  .pn-ftr__contact a{ font-size:14px; white-space:nowrap; }
}

/* owner: no Call/WhatsApp buttons under the footer email — the floating pair /
   foot bar already carries both on every page */
.pn-ftr__btns{ display:none; }

/* mobile CTA row: "Call +91 96505 45699" was clipping at 375px — the master
   injects a phone glyph and an arrow inside .ab-cta__row buttons; drop those
   on phones and tighten the type so both buttons genuinely fit one row. */
@media (max-width:760px){
  .ab-cta__row{ gap:8px; }
  .ab-cta__row .ab-btn{ font-size:13px; padding:10px 8px; letter-spacing:0; }
  .ab-cta__row .ab-btn::before, .ab-cta__row .ab-btn::after{ display:none !important; content:none !important; }
}
@media (max-width:360px){ .ab-cta__row .ab-btn{ font-size:12px; padding:10px 6px; } }

/* owner: drawer tiles with a submenu show a caret so readers know they open */
@media (max-width:1100px){
  .pn-nav.is-open .pn-has>button{ position:relative; }
  .pn-nav.is-open .pn-has>button::after{
    content:"▾"; position:absolute; right:8px; bottom:6px; font-size:16px; line-height:1;
    color:var(--gold-ink); opacity:.85; transition:transform .2s;
  }
  .pn-nav.is-open .pn-has[data-open="true"]>button::after{ transform:rotate(180deg); }
}

/* owner (mobile): credit bar — small type, exactly two lines, less height.
   line 1: DESIGNED BY … · AniketBhardwaj.Com   line 2: All Rights Reserved © || V.n */
@media (max-width:760px){
  .pn-credit{ display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center;
    column-gap:8px; row-gap:2px; padding:10px 12px calc(10px + 72px + env(safe-area-inset-bottom,0px)); font-size:11px; line-height:1.3; }
  .pn-credit .ab-credit__by{ order:1; font-size:11px; }
  .pn-credit .ab-credit__site{ order:2; font-size:11px; }
  .pn-credit .ab-credit__mid{ order:3; flex-basis:100%; text-align:center; font-size:11px; }
  .pn-credit .ab-credit__site::before{ content:"·"; margin-right:8px; color:#8F9BB8; }
}
/* two lines exactly: "DESIGNED BY …" / "All Rights Reserved © || V.n || AniketBhardwaj.Com" */
@media (max-width:760px){
  .pn-credit .ab-credit__by{ order:1; flex-basis:100%; text-align:center; letter-spacing:.02em; }
  .pn-credit .ab-credit__mid{ order:2; flex-basis:auto; letter-spacing:0; }
  .pn-credit .ab-credit__site{ order:3; letter-spacing:0; }
  .pn-credit .ab-credit__site::before{ content:none; }
  .pn-credit{ row-gap:1px; column-gap:6px; }
}

/* owner: PC floating contact pair at 70% size */
@media (min-width:761px){ .pn-bar{ transform:scale(.7); transform-origin:bottom right; right:14px; bottom:14px; } }

/* owner: PC footer back to the contained 1200px column ("pehle wala sahi tha") */
@media (min-width:761px){ .pn-ftr__in{ max-width:var(--wrap); } }