/* ==========================================================================
   Product page — Palette aligned (Navy/Gray/Orange/White)
   ========================================================================== */
:root{
    --c-primary:#000080;
    --c-muted:#808080;
    --c-accent:#FF5733;
    --c-white:#FFFFFF;
    --c-border:#E6E8EF;
    --c-ink:#0E1333;
    --site-max:1100px;
    --site-gutter:clamp(12px,3vw,24px);
    --shadow-sm:0 8px 24px rgba(0,0,0,.08);
}

/* Container */
.product-page .container{
    max-width:var(--site-max);
    margin-inline:auto;
    padding-inline:var(--site-gutter);
}

/* Hero */
.product-hero{
    position:relative;
    color:var(--c-white);
    padding:clamp(28px,6vw,72px) 0;
    background:var(--c-primary) center/cover no-repeat;
    background-image:var(--hero,none);
    isolation:isolate;
}
.product-hero::before{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(0,0,0,.15));
    z-index:-1;
}
.product-hero__kicker{
    margin:0 0 .35rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    opacity:.95;
}
.product-hero__title{
    margin:0;
    color:var(--c-white);
    font-weight:900;
    line-height:1.1;
    letter-spacing:.01em;
    font-size:clamp(1.6rem,3.6vw,2.4rem);
}

/* Main section */
.product{
    padding:clamp(24px,5vw,56px) 0;
    background:var(--c-white);
    color:var(--c-ink);
}
.product__grid{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:clamp(16px,3vw,28px);
    align-items:center;
}
@media (max-width:992px){
    .product__grid{grid-template-columns:1fr;}
}

.product__media{margin:0;}
.product__img{
    width:100%; display:block; object-fit:cover; border-radius:18px;
    box-shadow:var(--shadow-sm);
    transition:transform .35s ease;
}
.product__img:hover{transform:scale(1.02);}

.product__headline{
    margin:0 0 .35rem;
    color:var(--c-primary);
    font-weight:800;
    line-height:1.2;
    font-size:clamp(1.2rem,2.6vw,1.6rem);
}
.product__summary{
    margin:.25rem 0 .75rem;
    color:#2b2b2b;
    line-height:1.7;
}

/* Bullets */
.product__bullets{
    margin:0 0 1rem; padding:0; list-style:none; display:grid; gap:.5rem;
}
.product__bullets li{
    position:relative; padding-left:26px; color:#2b2b2b; line-height:1.6;
}
.product__bullets li::before{
    content:""; position:absolute; left:0; top:.55em;
    width:12px; height:12px; border-radius:50%;
    background:radial-gradient(circle at 30% 30%,#ff875e,var(--c-accent));
}

/* Actions / Buttons */
.product__actions{display:flex; gap:10px; flex-wrap:wrap;}
.product-page .btn{
    padding:.7rem 1.2rem; border-radius:999px; font-weight:800; text-decoration:none;
    background:var(--c-accent); color:var(--c-white);
    box-shadow:0 8px 22px rgba(255,87,51,.18);
    transition:transform .2s ease, box-shadow .2s ease;
}
.product-page .btn:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 28px rgba(255,87,51,.26);
}
.product-page .btn--ghost{
    background:transparent; color:var(--c-accent);
    border:2px solid var(--c-accent); box-shadow:none;
}
.product-page .btn--ghost:hover{background:#fff1ed;}

/* Optional gallery */
.product__gallery{
    margin-top:clamp(16px,3vw,24px);
    display:grid; grid-template-columns:repeat(3,1fr);
    gap:clamp(8px,2vw,16px);
}
.product__gallery img{
    width:100%; display:block; object-fit:cover; border-radius:14px;
}
@media (max-width:768px){
    .product__gallery{grid-template-columns:repeat(2,1fr);}
}