/* ================================================================
   LES GÉANTS NORDIQUES — style.css
   Design : Playfair Display + Lato · Brun / Beige / Vert / Or
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Lato:wght@300;400;700&display=swap');

/* ── VARIABLES ─────────────────────────────────────────────── */
:root {
  --brun:     #5A3E2B;
  --brun-dk:  #3D2519;
  --brun-lt:  #7D5A42;
  --beige:    #E8D5B7;
  --beige-lt: #F5EFE6;
  --beige-dk: #D4BC97;
  --vert:     #2F5D50;
  --vert-lt:  #3D7A6A;
  --vert-pale:#EAF2EF;
  --or:       #C9973A;
  --or-lt:    #E0B555;
  --rouge:    #A83232;
  --rouge-lt: #fde8e8;
  --text:     #2C1A0E;
  --muted:    #7A6050;
  --border:   #D9C8B2;
  --sh-sm:    0 2px 8px rgba(90,62,43,.10);
  --sh-md:    0 6px 24px rgba(90,62,43,.14);
  --sh-lg:    0 16px 48px rgba(90,62,43,.18);
  --r:        10px;
  --r-sm:     6px;
  --r-lg:     20px;
  --tr:       .22s cubic-bezier(.4,0,.2,1);
}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body { font-family:'Lato',sans-serif; font-size:16px; line-height:1.7; color:var(--text); background:var(--beige-lt); -webkit-font-smoothing:antialiased }
img  { max-width:100%; display:block }
a    { color:var(--brun); text-decoration:none; transition:color var(--tr) }
a:hover { color:var(--vert) }
ul,ol { list-style:none }

/* ── LAYOUT ─────────────────────────────────────────────────── */
.wrap     { max-width:1200px; margin:0 auto; padding:0 24px }
.section  { padding:80px 0 }
.bg-beige { background:var(--beige) }
.center   { text-align:center }
.mt-sm    { margin-top:.6rem }
.mt-md    { margin-top:1.4rem }
.mt-lg    { margin-top:3rem }
.mb-md    { margin-bottom:1.4rem }

/* ── TYPOGRAPHY ─────────────────────────────────────────────── */
h1,h2,h3,h4 { font-family:'Playfair Display',Georgia,serif; line-height:1.25 }
.section-title { font-size:clamp(1.8rem,3vw,2.8rem); color:var(--brun-dk); margin-bottom:.4rem; text-align:center }
.section-title.left { text-align:left }
.section-sub  { text-align:center; color:var(--muted); font-size:1rem; margin-bottom:3rem }
.eyebrow { display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--or); margin-bottom:.5rem }

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.68rem 1.55rem; border-radius:var(--r-sm); font-family:'Lato',sans-serif; font-weight:700; font-size:.88rem; letter-spacing:.03em; cursor:pointer; border:2px solid transparent; transition:all var(--tr); text-decoration:none }
.btn-primary       { background:var(--brun);   color:#fff; border-color:var(--brun) }
.btn-primary:hover { background:var(--brun-dk);color:#fff; border-color:var(--brun-dk); transform:translateY(-1px); box-shadow:var(--sh-sm) }
.btn-outline       { background:transparent; color:var(--brun); border-color:var(--brun) }
.btn-outline:hover { background:var(--brun); color:#fff }
.btn-outline-light { background:transparent; color:rgba(255,255,255,.9); border-color:rgba(255,255,255,.5) }
.btn-outline-light:hover { background:rgba(255,255,255,.15); color:#fff }
.btn-ghost         { background:transparent; color:var(--muted); border-color:var(--border) }
.btn-ghost:hover   { background:var(--beige); border-color:var(--brun-lt) }
.btn-danger        { background:var(--rouge); color:#fff; border-color:var(--rouge) }
.btn-danger:hover  { background:#8b2525 }
.btn-white         { background:#fff; color:var(--brun-dk); border-color:#fff }
.btn-white:hover   { background:var(--beige); color:var(--brun-dk) }
.btn-outline-white { background:transparent; color:rgba(255,255,255,.9); border-color:rgba(255,255,255,.5) }
.btn-outline-white:hover { background:rgba(255,255,255,.15); color:#fff }
.btn-sm     { padding:.38rem .9rem; font-size:.8rem }
.btn-lg     { padding:.85rem 2rem; font-size:1rem }
.btn-full   { width:100%; justify-content:center }
.lnk        { color:var(--brun); font-size:.9rem; text-decoration:underline }
.lnk:hover  { color:var(--vert) }

/* ── FLASH ──────────────────────────────────────────────────── */
.flash { padding:1rem 1.4rem; border-radius:var(--r-sm); margin-bottom:1.5rem; font-weight:700 }
.flash ul { padding-left:1.2rem; list-style:disc }
.flash-ok  { background:var(--vert-pale); color:var(--vert); border-left:4px solid var(--vert) }
.flash-err { background:var(--rouge-lt);  color:var(--rouge);border-left:4px solid var(--rouge) }

/* ── TOPBAR ─────────────────────────────────────────────────── */
.topbar { background:var(--brun-dk); color:var(--beige-dk); font-size:.74rem; text-align:center; padding:.38rem 1rem; letter-spacing:.05em }

/* ── HEADER ─────────────────────────────────────────────────── */
.header { position:sticky; top:0; z-index:200; background:var(--brun-dk); border-bottom:3px solid var(--or); box-shadow:var(--sh-md) }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:72px }
.logo { display:flex; align-items:center }
.logo img { height:60px; width:auto; object-fit:contain; mix-blend-mode:screen; transition:transform var(--tr) }
.logo:hover img { transform:scale(1.04) }
.nav { display:flex; align-items:center; gap:2rem }
.nav a { color:var(--beige); font-weight:700; font-size:.88rem; letter-spacing:.04em; position:relative }
.nav a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px; background:var(--or); transition:width var(--tr) }
.nav a:hover,.nav a.active { color:var(--or) }
.nav a:hover::after,.nav a.active::after { width:100% }
.nav-cart { position:relative }
.cart-badge { position:absolute; top:-8px; right:-13px; background:var(--or); color:var(--brun-dk); font-size:.62rem; font-weight:900; width:18px; height:18px; border-radius:50%; display:flex; align-items:center; justify-content:center }
.burger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px }
.burger span { display:block; width:24px; height:2px; background:var(--beige); border-radius:2px; transition:all var(--tr) }

/* ── FOOTER ─────────────────────────────────────────────────── */
.footer { background:var(--brun-dk); color:var(--beige); padding:3rem 0 1.5rem }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:3rem; margin-bottom:2rem }
.footer-logo { height:56px; width:auto; object-fit:contain; mix-blend-mode:screen; margin-bottom:.6rem }
.footer-tagline,.footer-copy { font-size:.85rem; color:var(--beige-dk); line-height:1.6 }
.footer h4 { font-family:'Playfair Display',serif; font-size:.95rem; color:var(--beige); margin-bottom:.8rem }
.footer-nav { display:flex; flex-direction:column; gap:.4rem }
.footer-nav a { color:var(--beige-dk); font-size:.85rem }
.footer-nav a:hover { color:var(--or) }
.footer p { font-size:.85rem; color:var(--beige-dk); margin-bottom:.35rem }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:1.4rem; text-align:center; font-size:.76rem; color:var(--brun-lt) }

/* ── PAGE BANNER ────────────────────────────────────────────── */
.page-banner { background:linear-gradient(135deg,var(--brun-dk),var(--brun)); padding:56px 0 44px; color:#fff; text-align:center }
.page-banner h1 { font-size:clamp(2rem,4vw,3rem); color:#fff; margin-bottom:.4rem }
.page-banner p  { color:rgba(255,255,255,.75) }
.page-banner-sm { padding:32px 0 28px }
.breadcrumb { display:flex; align-items:center; gap:.5rem; font-size:.8rem; color:rgba(255,255,255,.6); justify-content:center; margin-bottom:.4rem }
.breadcrumb a:hover { color:#fff }
.breadcrumb span:last-child { color:var(--or) }

/* ── SLIDER ─────────────────────────────────────────────────── */
.slider { position:relative; overflow:hidden; min-height:580px; background:var(--brun-dk) }
.slide  { position:absolute; inset:0; min-height:580px; background-size:cover; background-position:center; opacity:0; pointer-events:none; transition:opacity .85s cubic-bezier(.4,0,.2,1) }
.slide.active { opacity:1; pointer-events:auto; position:relative }
.slide-grad   { position:absolute; inset:0 }
.slide-grad-0 { background:linear-gradient(135deg,#3D2519 0%,#5A3E2B 50%,#2F5D50 100%) }
.slide-grad-1 { background:linear-gradient(135deg,#1A3020 0%,#2F5D50 55%,#3D7A6A 100%) }
.slide-grad-2 { background:linear-gradient(135deg,#2C1A0E 0%,#5A3E2B 45%,#7D5A42 100%) }
.slide-overlay { position:absolute; inset:0; z-index:1 }
.slide-body  { position:relative; z-index:2; display:flex; align-items:center; min-height:580px; padding:90px 0 80px }
.slide-text  { max-width:620px }
/* Éléments animés : état initial caché, SANS transition */
.slide-eye   { font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--or-lt); margin-bottom:.7rem; opacity:0; transform:translateY(10px) }
.slide-title { font-family:'Playfair Display',serif; font-size:clamp(2.6rem,5.5vw,4.8rem); color:#fff; line-height:1.08; margin-bottom:1.3rem; opacity:0; transform:translateY(16px) }
.slide-sub   { font-size:1.02rem; color:rgba(255,255,255,.82); font-weight:300; line-height:1.7; max-width:520px; margin-bottom:2.4rem; opacity:0; transform:translateY(12px) }
.slide-btns  { display:flex; gap:1rem; flex-wrap:wrap; opacity:0; transform:translateY(10px) }
/* Quand la slide est active : transitions d'entrée avec délais en cascade */
.slide.active .slide-eye   { opacity:1; transform:none; transition:opacity .6s .15s ease, transform .6s .15s ease }
.slide.active .slide-title { opacity:1; transform:none; transition:opacity .7s .30s ease, transform .7s .30s ease }
.slide.active .slide-sub   { opacity:1; transform:none; transition:opacity .7s .48s ease, transform .7s .48s ease }
.slide.active .slide-btns  { opacity:1; transform:none; transition:opacity .6s .63s ease, transform .6s .63s ease }
.sl-prev,.sl-next { position:absolute; top:50%; transform:translateY(-50%); z-index:10; background:rgba(255,255,255,.14); backdrop-filter:blur(8px); border:1.5px solid rgba(255,255,255,.3); color:#fff; width:50px; height:50px; border-radius:50%; font-size:1.25rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .2s }
.sl-prev:hover,.sl-next:hover { background:rgba(255,255,255,.26); transform:translateY(-50%) scale(1.08) }
.sl-prev { left:22px }
.sl-next { right:22px }
.sl-dots { position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:10; display:flex; gap:.55rem; align-items:center }
.sl-dot  { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.32); border:1.5px solid rgba(255,255,255,.5); cursor:pointer; padding:0; transition:all .3s }
.sl-dot.active { background:var(--or-lt); border-color:var(--or-lt); width:26px; border-radius:5px }
.sl-bar  { position:absolute; bottom:0; left:0; height:3px; background:var(--or); z-index:10; width:0; transition:width linear }

/* ── STATS BAND ─────────────────────────────────────────────── */
.stats-band { background:var(--or); padding:1.4rem 0 }
.stats-row  { display:flex; align-items:center; justify-content:center; gap:1.5rem; flex-wrap:wrap }
.stat       { text-align:center }
.stat strong { display:block; font-family:'Playfair Display',serif; font-size:1.4rem; color:var(--brun-dk) }
.stat span   { font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--brun) }
.stat-sep    { width:1px; height:30px; background:rgba(61,37,25,.25) }

/* ── CARDS ──────────────────────────────────────────────────── */
.grid-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:2rem }
.grid-3     { grid-template-columns:repeat(auto-fill,minmax(240px,1fr)) }
.card { background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-sm); transition:transform var(--tr),box-shadow var(--tr) }
.card:hover { transform:translateY(-4px); box-shadow:var(--sh-md) }
.card-img   { display:block; position:relative; overflow:hidden; aspect-ratio:4/3; background:var(--beige) }
.card-img img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease }
.card:hover .card-img img { transform:scale(1.06) }
.card-img-hover { position:absolute; inset:0; background:rgba(61,37,25,.55); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:.9rem; opacity:0; transition:opacity var(--tr) }
.card:hover .card-img-hover { opacity:1 }
.card-badge { position:absolute; top:10px; right:10px; padding:.22rem .65rem; border-radius:999px; font-size:.72rem; font-weight:700 }
.badge-pure   { background:var(--brun); color:#fff }
.badge-croise { background:var(--vert); color:#fff }
.card-body  { padding:1.2rem }
.card-metas { display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:.4rem }
.card-metas span { font-size:.75rem; color:var(--muted); font-weight:700 }
.card-nom   { font-size:1.2rem; margin-bottom:.35rem; color:var(--brun-dk) }
.card-desc  { font-size:.86rem; color:var(--muted); margin-bottom:.9rem; line-height:1.5 }
.card-foot  { display:flex; align-items:center; justify-content:space-between }
.card-prix  { font-family:'Playfair Display',serif; font-size:1.3rem; font-weight:700; color:var(--brun) }

/* ── ABOUT ──────────────────────────────────────────────────── */
.about-grid  { display:grid; grid-template-columns:1fr 1.4fr; gap:4rem; align-items:center }
.about-img   { display:flex; align-items:center; justify-content:center }
.about-emblem { font-size:8rem; background:var(--beige-dk); border-radius:var(--r-lg); width:100%; aspect-ratio:1; display:flex; align-items:center; justify-content:center }
.about-text p { color:var(--muted); margin-bottom:1rem }
.check-list { margin-top:1.5rem; display:flex; flex-direction:column; gap:.5rem }
.check-list li { display:flex; align-items:center; gap:.7rem; font-weight:700; font-size:.92rem }
.chk { width:20px; height:20px; border-radius:50%; background:var(--vert); color:#fff; display:flex; align-items:center; justify-content:center; font-size:.68rem; flex-shrink:0 }

/* ── RACES ──────────────────────────────────────────────────── */
.races-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem }
.race-card  { padding:2.5rem; border-radius:var(--r-lg); border:2px solid var(--border); transition:all var(--tr) }
.race-pure   { background:linear-gradient(135deg,#fffbf5,var(--beige)); border-color:var(--or) }
.race-croise { background:linear-gradient(135deg,#f5faf7,var(--vert-pale)); border-color:var(--vert) }
.race-card:hover { transform:translateY(-3px); box-shadow:var(--sh-md) }
.race-icon { font-size:2.4rem; margin-bottom:.9rem }
.race-card h3 { font-size:1.7rem; margin-bottom:.7rem }
.race-card p  { color:var(--muted); font-size:.9rem; margin-bottom:1rem }
.race-card ul { color:var(--muted); font-size:.87rem }
.race-card ul li { padding:.2rem 0 }

/* ── CTA ────────────────────────────────────────────────────── */
.cta-section { background:var(--brun-dk) }
.cta-section h2 { font-size:2rem; color:#fff; margin-bottom:.7rem }
.cta-section p  { color:rgba(255,255,255,.7); margin-bottom:2rem }
.cta-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap }

/* ── FILTERS ────────────────────────────────────────────────── */
.filters { display:flex; flex-wrap:wrap; gap:1rem; align-items:flex-end; background:#fff; padding:1.1rem 1.4rem; border-radius:var(--r); box-shadow:var(--sh-sm); margin-bottom:2.4rem; border:1px solid var(--border) }
.filter-label { display:block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); margin-bottom:.35rem }
.filter-pills { display:flex; gap:.35rem; flex-wrap:wrap }
.pill { padding:.3rem .8rem; border-radius:999px; font-size:.78rem; font-weight:700; border:1.5px solid var(--border); color:var(--muted); background:#fff; transition:all var(--tr); text-decoration:none; display:inline-block }
.pill:hover { border-color:var(--brun); color:var(--brun) }
.pill.on    { background:var(--brun); border-color:var(--brun); color:#fff }
.filter-sort { margin-left:auto; display:flex; flex-direction:column }
.filter-sort select { padding:.42rem .85rem; border:1.5px solid var(--border); border-radius:var(--r-sm); font-family:'Lato',sans-serif; font-size:.88rem; background:var(--beige-lt); cursor:pointer }
.filter-count { font-size:.8rem; color:var(--muted); font-weight:700; margin-left:auto; align-self:flex-end }

/* ── PAGINATION ─────────────────────────────────────────────── */
.pagination { display:flex; justify-content:center; gap:.4rem; flex-wrap:wrap }
.pg-btn { padding:.45rem .88rem; border:1.5px solid var(--border); border-radius:var(--r-sm); font-size:.88rem; font-weight:700; color:var(--brun); background:#fff; transition:all var(--tr) }
.pg-btn:hover,.pg-btn.on { background:var(--brun); border-color:var(--brun); color:#fff }

/* ── EMPTY STATE ────────────────────────────────────────────── */
.empty-state { text-align:center; padding:5rem 1rem }
.empty-state span { font-size:4rem; display:block; margin-bottom:1rem }
.empty-state p { color:var(--muted); font-size:1.05rem; margin-bottom:1.5rem }
.empty-msg { color:var(--muted); font-size:.95rem; padding:2rem 0 }

/* ── DETAIL LAPIN ───────────────────────────────────────────── */
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start }
.detail-media { position:relative; border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-md) }
.detail-media img { width:100%; aspect-ratio:1; object-fit:cover }
.detail-badge { position:absolute; top:14px; left:14px; padding:.3rem .85rem; border-radius:999px; font-size:.78rem; font-weight:700 }
.detail-nom   { font-size:2.4rem; color:var(--brun-dk); margin-bottom:1.4rem }
.detail-attrs { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; margin-bottom:1.7rem }
.attr      { background:var(--beige); border-radius:var(--r-sm); padding:.65rem .9rem }
.attr-lbl  { display:block; font-size:.66rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); font-weight:700; margin-bottom:.15rem }
.detail-desc h3 { font-size:1.15rem; margin-bottom:.5rem }
.detail-desc p  { color:var(--muted); line-height:1.8 }
.detail-buy { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; margin:1.8rem 0 .8rem }
.detail-prix { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--brun) }
.detail-note { display:flex; align-items:center; gap:.6rem; font-size:.8rem; color:var(--muted); font-style:italic; background:var(--beige); padding:.75rem .95rem; border-radius:var(--r-sm) }

/* ── PANIER ─────────────────────────────────────────────────── */
.cart-layout { display:grid; grid-template-columns:1fr 320px; gap:3rem; align-items:start }
.cart-items  { display:flex; flex-direction:column; gap:.9rem }
.cart-row    { display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; background:#fff; border:1px solid var(--border); border-radius:var(--r); padding:.9rem; box-shadow:var(--sh-sm) }
.cart-thumb  { width:78px; height:78px; object-fit:cover; border-radius:8px; flex-shrink:0 }
.cart-info   { flex:1; min-width:100px }
.cart-info h3 { font-size:1rem; margin-bottom:.15rem }
.cart-info small { color:var(--muted); font-size:.78rem }
.cart-total  { font-family:'Playfair Display',serif; font-size:1.15rem; font-weight:700; min-width:85px; text-align:right }
.btn-x       { background:none; border:none; cursor:pointer; color:var(--muted); font-size:.95rem; padding:.3rem .5rem; border-radius:var(--r-sm); transition:all var(--tr) }
.btn-x:hover { background:var(--rouge-lt); color:var(--rouge) }
.qty-form    { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap }
.qty-ctrl    { display:flex; align-items:center }
.qty-ctrl button { width:28px; height:32px; background:var(--beige); border:1.5px solid var(--border); font-size:.95rem; cursor:pointer; transition:background var(--tr) }
.qty-ctrl button:first-child { border-radius:var(--r-sm) 0 0 var(--r-sm) }
.qty-ctrl button:last-child  { border-radius:0 var(--r-sm) var(--r-sm) 0 }
.qty-ctrl button:hover { background:var(--beige-dk) }
.qty-ctrl input { width:46px; height:32px; border:1.5px solid var(--border); border-left:none; border-right:none; text-align:center; font-family:'Lato',sans-serif; font-size:.88rem }
.qty-ctrl input:focus { outline:none }
.cart-bar { display:flex; align-items:center; justify-content:space-between; padding:.4rem 0 }
.cart-recap { background:#fff; border-radius:var(--r); padding:1.6rem; box-shadow:var(--sh-sm); border:1px solid var(--border); position:sticky; top:90px }
.cart-recap h3 { font-size:1.3rem; margin-bottom:1.3rem; color:var(--brun-dk) }
.recap-lines { display:flex; flex-direction:column; gap:.45rem; margin-bottom:.9rem }
.recap-line  { display:flex; align-items:center; gap:.6rem; font-size:.87rem; padding:.3rem 0; border-bottom:1px solid var(--border) }
.recap-line:last-child { border-bottom:none }
.recap-line span:nth-child(2) { flex:1; color:var(--muted) }
.recap-line span:last-child { font-weight:700 }
.recap-total { display:flex; justify-content:space-between; font-size:1rem; margin-bottom:.5rem }
.recap-note  { font-size:.76rem; color:var(--muted); font-style:italic; margin-bottom:1.1rem }

/* ── CHECKOUT ───────────────────────────────────────────────── */
.checkout-layout { display:grid; grid-template-columns:1.3fr 1fr; gap:4rem; align-items:start }
.checkout-note { background:var(--beige); border-left:3px solid var(--or); padding:.9rem 1.1rem; border-radius:var(--r-sm); font-size:.84rem; color:var(--muted); margin:1rem 0 }

/* ── CONTACT ────────────────────────────────────────────────── */
.contact-layout { display:grid; grid-template-columns:1fr 1.5fr; gap:4rem; align-items:start }
.contact-info h2 { font-size:1.7rem; color:var(--brun-dk); margin-bottom:1.4rem }
.cinfo { display:flex; gap:.9rem; align-items:flex-start; margin-bottom:1rem }
.cinfo > span { font-size:1.3rem; flex-shrink:0; margin-top:.1rem }
.cinfo strong { display:block; font-size:.92rem; margin-bottom:.15rem }
.cinfo p { font-size:.85rem; color:var(--muted); margin:0 }

/* ── FORMS ──────────────────────────────────────────────────── */
.fg { margin-bottom:1.3rem }
.form-row2 { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem }
.fg label { display:block; font-weight:700; font-size:.82rem; margin-bottom:.38rem; color:var(--muted); text-transform:uppercase; letter-spacing:.05em }
.fg input,.fg select,.fg textarea { width:100%; padding:.7rem .95rem; border:1.5px solid var(--border); border-radius:var(--r-sm); font-family:'Lato',sans-serif; font-size:.93rem; color:var(--text); background:var(--beige-lt); transition:border-color var(--tr) }
.fg input:focus,.fg select:focus,.fg textarea:focus { outline:none; border-color:var(--brun); background:#fff }
.fg textarea { resize:vertical }
.fg small { display:block; color:var(--muted); font-size:.76rem; margin-top:.3rem }

/* ── AOS ─────────────────────────────────────────────────────── */
[data-aos] { opacity:0; transform:translateY(18px); transition:opacity .6s ease,transform .6s ease }
[data-aos].aos-in { opacity:1; transform:none }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media(max-width:960px){
  .detail-grid,.about-grid,.checkout-layout { grid-template-columns:1fr; gap:2.5rem }
  .about-img { display:none }
  .races-grid { grid-template-columns:1fr }
  .cart-layout { grid-template-columns:1fr }
  .cart-recap  { position:static }
  .footer-grid { grid-template-columns:1fr 1fr }
  .contact-layout { grid-template-columns:1fr }
}
@media(max-width:680px){
  .section { padding:50px 0 }
  .slider,.slide,.slide-body { min-height:500px }
  .slide-body { padding:60px 0 }
  .topbar { display:none }
  .nav { display:none; position:fixed; top:72px; left:0; right:0; background:var(--brun-dk); flex-direction:column; padding:1.4rem; gap:0; border-top:2px solid var(--or); box-shadow:var(--sh-md); z-index:199 }
  .nav.open { display:flex }
  .nav a { padding:.75rem 0; border-bottom:1px solid rgba(255,255,255,.1); width:100% }
  .nav a:last-child { border-bottom:none }
  .burger { display:flex }
  .filters { flex-direction:column; align-items:stretch }
  .filter-count,.filter-sort { margin-left:0 }
  .form-row2 { grid-template-columns:1fr }
  .detail-attrs { grid-template-columns:1fr 1fr }
  .sl-prev { left:12px }
  .sl-next { right:12px }
  .footer-grid { grid-template-columns:1fr }
  .cart-row { flex-wrap:wrap }
  .stats-row { gap:1rem }
  .stat-sep { display:none }
}