/* ==========================================================================
   NND Oil & Gas — product-detail.css : page-specific styles for the
   product detail template (loaded with main.css on product-detail.html).
   ========================================================================== */

/* Full-height split banner: content left, form right */
.pdp-hero{position:relative;color:#fff;overflow:hidden;display:flex;align-items:center;
  min-height:calc(100svh - var(--header-h));padding-block:clamp(2.5rem,5vw,4rem);
  background:radial-gradient(120% 140% at 95% -20%,rgba(78,91,234,.32),transparent 55%),
             radial-gradient(90% 120% at -10% 120%,rgba(27,39,199,.30),transparent 52%),
             linear-gradient(120deg,#050C30 0%,#0B1A57 60%,#14237A 100%)}
.pdp-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;width:100%}
.pdp-hero__badge{display:inline-block;font-family:var(--font-head);font-size:var(--fs-xs);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;padding:.35rem .7rem;border-radius:var(--r-sm);
  background:rgba(255,255,255,.14);color:#fff}
.pdp-hero h1{color:#fff;margin-top:1.1rem;font-size:clamp(2.2rem,1.4rem + 3vw,3.4rem)}
.pdp-hero__sub{color:var(--c-on-dark);margin-top:1.1rem;max-width:54ch;font-size:var(--fs-lg)}
.pdp-hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.9rem}
.pdp-hero--compact{min-height:0}
.pdp-hero__grid--solo{grid-template-columns:1fr;max-width:820px}
@media(max-width:920px){.pdp-hero{min-height:0}.pdp-hero__grid{grid-template-columns:1fr;gap:2.25rem}}

/* enquiry form card (in banner) */
.pdp-form{position:relative;background:var(--c-bg-0);border:1px solid var(--c-line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);padding:clamp(1.5rem,3vw,2.25rem);overflow:hidden;color:var(--c-text)}
.pdp-form::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;
  background:linear-gradient(90deg,var(--c-accent-500),var(--c-accent-400))}
.pdp-form h2{font-size:1.5rem;margin-top:.4rem;color:var(--c-heading)}
.pdp-form .sub{font-size:var(--fs-sm);color:var(--c-ink-600);margin:.4rem 0 1.3rem}
.pdp-form .field{margin-bottom:.85rem}
.pdp-form__row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-bottom:.85rem}
.pdp-form__row .field{margin-bottom:0}
@media(max-width:480px){.pdp-form__row{grid-template-columns:1fr;gap:0}.pdp-form__row .field{margin-bottom:.85rem}}
.pdp-form__badge{background:rgba(27,39,199,.12);color:var(--c-accent-700)}
.pdp-form .textarea{min-height:96px}
.pdp-form .btn--block{margin-top:1rem}

/* zigzag content blocks (full width) */
.zz{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.zz + .zz, .zz + .pdp-block, .pdp-block + .pdp-block, .pdp-block + .zz{margin-top:clamp(3rem,6vw,5.5rem)}
.zz__media > img{width:100%;height:auto;display:block;border-radius:var(--r-lg);box-shadow:var(--shadow-md);
  background:#fff}
.zz--rev .zz__media{order:-1}
.zz__tag{display:inline-block;font-family:var(--font-head);font-size:var(--fs-xs);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--c-accent-600);margin-bottom:.6rem}
.zz h2{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.2rem)}
.zz .flow{margin-top:1rem}
.zz:not(:has(.zz__media)){grid-template-columns:1fr;max-width:820px}
@media(max-width:680px){.zz{grid-template-columns:1fr}.zz--rev .zz__media{order:0}}
.pdp-chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.pdp-note{margin-top:1rem;font-size:var(--fs-sm);color:var(--c-ink-400)}

.pdp-block__head{margin-bottom:1.5rem}
.pdp-block__head h2{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.2rem)}

/* Gallery cards + lightbox are now global — see common.css (.gallery-grid). */

/* FAQ two-per-row (single-open) + content-row full-width fallbacks */
/* FAQ: two INDEPENDENT columns (each a vertical stack) so opening an item only
   pushes the items below it in the SAME column — the other column never moves. */
.pdp-faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); align-items: start;
  border: 0; border-radius: 0; overflow: visible; }
.pdp-faq-col { display: flex; flex-direction: column; gap: var(--sp-4); }
.pdp-faq-grid .accordion__item { border: 1px solid var(--c-border); border-radius: var(--r-md);
  background: var(--c-bg-0); overflow: hidden; }
@media (max-width: 768px) { .pdp-faq-grid { grid-template-columns: 1fr; } }
.pdp-fullwidth { margin-inline: auto; }
.single-product .pdp-fullwidth p{width: auto;
    max-width: none;}
.pdp-fullwidth-img img { width: 100%; height: auto; border-radius: var(--r-lg); display: block; }

/* Image-only content block: heading above, full-width image */
.pdp-imgblock .section-head { margin-bottom: var(--sp-5); }
