/* =====================================================================
   AMB OILS · PREMIUM REDESIGN SYSTEM  (index page)
   Brand palette preserved:  gold #b88722 / #c79f3f / #d4a63b · ink #1a1a1a
   Namespaced with .ax-  so nothing in main.css is overridden by accident.
   ===================================================================== */

:root{
    --ax-gold-1:#b88722;
    --ax-gold-2:#c79f3f;
    --ax-gold-3:#d4a63b;
    --ax-gold-soft:#e7c874;
    --ax-ink:#1a1a1a;
    --ax-ink-2:#232323;
    --ax-cream:#faf7f0;
    --ax-cream-2:#f3ecdd;
    --ax-text:#20242b;
    --ax-muted:#6c7280;
    --ax-line:rgba(0,0,0,.08);
    --ax-grad:linear-gradient(120deg,var(--ax-gold-1) 0%,var(--ax-gold-2) 45%,var(--ax-gold-3) 100%);
    --ax-shadow:0 22px 55px rgba(120,85,15,.16);
    --ax-radius:20px;
    --ax-ease:cubic-bezier(.16,.84,.44,1);
}

/* ---- Base rhythm for the redesigned page (scoped to our sections) ---- */
.ax-page{ background:var(--ax-cream); color:var(--ax-text); overflow-x:hidden; }
.ax-section{ position:relative; padding:96px 0; z-index:1; }
.ax-wrap{ width:min(1180px,92vw); margin:0 auto; }
.ax-center{ text-align:center; }

.ax-eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:13px; font-weight:800; letter-spacing:2.5px; text-transform:uppercase;
    color:var(--ax-gold-1);
    margin:0 0 16px;
}
.ax-eyebrow::before, .ax-eyebrow.ax-two::after{
    content:""; width:34px; height:2px; border-radius:2px;
    background:var(--ax-grad);
}
.ax-title{
    font-size:clamp(28px,4vw,46px);
    line-height:1.1; font-weight:900; letter-spacing:-.5px;
    margin:0 0 18px; color:var(--ax-ink);
}
.ax-title .ax-hl{
    background:var(--ax-grad);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.ax-lead{
    font-size:clamp(15px,1.5vw,17px); line-height:1.75; color:var(--ax-muted);
    max-width:640px;
}
.ax-center .ax-lead, .ax-center .ax-eyebrow{ margin-left:auto; margin-right:auto; }

/* ---- Buttons ---- */
.ax-btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:15px 30px; border-radius:14px;
    font-size:15px; font-weight:800; letter-spacing:.3px;
    text-decoration:none; cursor:pointer; border:none;
    position:relative; overflow:hidden;
    transition:transform .35s var(--ax-ease), box-shadow .35s var(--ax-ease);
}
.ax-btn i{ transition:transform .35s var(--ax-ease); }
.ax-btn:hover{ transform:translateY(-3px); }
.ax-btn:hover i{ transform:translateX(4px); }
.ax-btn-gold{ background:var(--ax-grad); color:#fff; box-shadow:0 14px 30px rgba(199,159,63,.38); }
.ax-btn-gold:hover{ color:#fff; box-shadow:0 20px 40px rgba(199,159,63,.5); }
.ax-btn-ghost{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.4); }
.ax-btn-ghost:hover{ color:#fff; background:rgba(255,255,255,.1); border-color:#fff; }
.ax-btn-dark{ background:var(--ax-ink); color:#fff; box-shadow:0 12px 26px rgba(0,0,0,.22); }
.ax-btn-dark:hover{ color:#fff; }
.ax-btn::after{                         /* shine sweep */
    content:""; position:absolute; top:0; left:-130%;
    width:55%; height:100%; transform:skewX(-20deg);
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);
}
.ax-btn:hover::after{ animation:ax-shine .9s ease; }
@keyframes ax-shine{ to{ left:150%; } }

/* =====================================================================
   AMBIENT OIL DROPLET FIELD  (fixed, behind content)
   ===================================================================== */
.ax-oil-field{ position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
.ax-drop{
    position:absolute; bottom:-60px; width:14px; height:16px;
    border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;
    background:radial-gradient(circle at 33% 25%, #fff4c6 0%, #f2c749 26%, #dca325 55%, #b17d18 100%);
    box-shadow:0 0 16px rgba(224,170,43,.6), 0 2px 6px rgba(120,80,10,.35),
               inset -2px -3px 6px rgba(120,80,10,.5), inset 2px 2px 4px rgba(255,240,180,.5);
    opacity:0; filter:saturate(1.15);
    animation:ax-float linear infinite;
}
.ax-drop::after{
    content:""; position:absolute; top:15%; left:22%; width:34%; height:28%;
    border-radius:50%; background:rgba(255,250,220,.9); filter:blur(.4px);
}
@keyframes ax-float{
    0%{ transform:translateY(0) translateX(0) scale(.7); opacity:0; }
    10%{ opacity:.5; }
    50%{ transform:translateY(-52vh) translateX(16px) scale(1); opacity:.42; }
    90%{ opacity:.22; }
    100%{ transform:translateY(-106vh) translateX(-10px) scale(1.1); opacity:0; }
}

/* =====================================================================
   STICKY NAV — premium refresh (markup kept from theme, applies site-wide)
   ===================================================================== */
.sticky{
    box-shadow:0 8px 30px rgba(0,0,0,.06);
    backdrop-filter:saturate(1.1);
    border-bottom:1px solid rgba(199,159,63,.14);
}
.nav ul > li > a.hyper_link_class{
    position:relative; font-weight:700; transition:color .3s ease;
}
.nav ul > li > a.hyper_link_class::after{
    content:""; position:absolute; left:12px; right:12px; bottom:4px; height:2px;
    background:var(--ax-grad); border-radius:2px;
    transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ax-ease);
}
.nav ul > li:hover > a.hyper_link_class::after{ transform:scaleX(1); }
.nav ul > li:hover > a.hyper_link_class{ color:var(--ax-gold-1); }

/* =====================================================================
   INTERIOR PAGES  (About, Products, Contact, Blogs, policies, etc.)
   ===================================================================== */
.ax-page-hero{ position:relative; overflow:hidden; background:#0e0e0e; padding:96px 0 74px; z-index:1; }
.ax-page-hero__bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:.3; z-index:0; }
.ax-page-hero::after{ content:""; position:absolute; inset:0; z-index:0;
    background:radial-gradient(900px 420px at 12% 0%, rgba(199,159,63,.32), transparent 60%),
               linear-gradient(180deg, rgba(10,10,10,.72), rgba(12,12,12,.93)); }
.ax-page-hero__splash{ position:absolute; right:-3%; bottom:-14%; width:min(560px,48%); opacity:.5; z-index:1;
    pointer-events:none; filter:drop-shadow(0 20px 40px rgba(199,159,63,.4)); animation:ax-splash-float 8s ease-in-out infinite; }
.ax-page-hero .ax-wrap{ position:relative; z-index:2; }
.ax-page-hero__title{ font-size:clamp(32px,5vw,56px); font-weight:900; color:#fff; letter-spacing:-1px; margin:12px 0 14px; line-height:1.05; }
.ax-page-hero__title .ax-hl{ background:linear-gradient(120deg,var(--ax-gold-soft),var(--ax-gold-3),var(--ax-gold-1));
    -webkit-background-clip:text; background-clip:text; color:transparent; }
.ax-breadcrumb{ display:flex; align-items:center; gap:10px; font-size:14px; font-weight:600; color:rgba(255,255,255,.55); flex-wrap:wrap; }
.ax-breadcrumb a{ color:var(--ax-gold-3); text-decoration:none; }
.ax-breadcrumb a:hover{ color:#fff; }
.ax-breadcrumb i{ font-size:9px; opacity:.6; }

/* rich text / prose */
.ax-prose{ font-size:16px; line-height:1.85; color:#3a3f47; }
.ax-prose > p{ margin:0 0 18px; }
.ax-prose h1,.ax-prose h2,.ax-prose h3,.ax-prose h4{ color:var(--ax-ink); font-weight:800; margin:30px 0 14px; line-height:1.25; }
.ax-prose h2{ font-size:26px; } .ax-prose h3{ font-size:21px; } .ax-prose h4{ font-size:18px; }
.ax-prose a{ color:var(--ax-gold-1); font-weight:700; }
.ax-prose ul,.ax-prose ol{ margin:0 0 18px; padding-left:22px; }
.ax-prose li{ margin:0 0 10px; }
.ax-prose img{ max-width:100%; height:auto; border-radius:14px; margin:16px 0; }
.ax-prose b,.ax-prose strong{ color:var(--ax-ink); }
.ax-prose blockquote{ border-left:4px solid var(--ax-gold-2); background:#fff; padding:14px 20px; border-radius:0 12px 12px 0; margin:18px 0; color:#555; }

/* generic white card */
.ax-card{ background:#fff; border:1px solid var(--ax-line); border-radius:20px; padding:32px; box-shadow:0 10px 30px rgba(0,0,0,.05); }

/* two-column split (image + text) */
.ax-split{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
@media(max-width:1024px){ .ax-split{ grid-template-columns:1fr; gap:40px; } }

/* responsive video */
.ax-video{ position:relative; padding-top:56.25%; border-radius:20px; overflow:hidden; box-shadow:var(--ax-shadow); border:1px solid var(--ax-line); }
.ax-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* forms */
.ax-form{ display:grid; gap:18px; }
.ax-form .ax-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.ax-field label{ display:block; font-size:13px; font-weight:700; color:var(--ax-ink); margin-bottom:8px; }
.ax-field input,.ax-field select,.ax-field textarea{ width:100%; padding:14px 16px; border:1.5px solid var(--ax-line); border-radius:12px;
    background:#fff; font-size:15px; color:var(--ax-text); font-family:inherit; transition:border-color .25s ease, box-shadow .25s ease; }
.ax-field input:focus,.ax-field select:focus,.ax-field textarea:focus{ outline:none; border-color:var(--ax-gold-2); box-shadow:0 0 0 4px rgba(199,159,63,.14); }
.ax-field textarea{ min-height:150px; resize:vertical; }
@media(max-width:640px){ .ax-form .ax-row{ grid-template-columns:1fr; } }

/* sidebar widgets */
.ax-widget{ background:#fff; border:1px solid var(--ax-line); border-radius:18px; padding:24px; margin-bottom:22px; box-shadow:0 8px 24px rgba(0,0,0,.05); }
.ax-widget__title{ font-size:16px; font-weight:800; color:var(--ax-ink); margin:0 0 16px; padding-bottom:12px; border-bottom:1px solid var(--ax-line); position:relative; }
.ax-widget__title::after{ content:""; position:absolute; left:0; bottom:-1px; width:46px; height:3px; border-radius:3px; background:var(--ax-grad); }
.ax-widget ul{ list-style:none; margin:0; padding:0; }
.ax-widget ul li a{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:11px 12px; border-radius:10px;
    color:var(--ax-text); text-decoration:none; font-weight:600; font-size:14px; transition:.25s ease; }
.ax-widget ul li a:hover{ background:rgba(199,159,63,.1); color:var(--ax-gold-1); padding-left:16px; }
.ax-follow{ display:flex; gap:12px; flex-wrap:wrap; }
.ax-follow a{ width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; color:#fff;
    background:var(--ax-grad); font-size:18px; transition:transform .3s ease; text-decoration:none; }
.ax-follow a:hover{ transform:translateY(-4px); color:#fff; }

/* product detail */
.ax-pd{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start; }
.ax-pd__main{ background:linear-gradient(180deg,#fbf7ec,#fff); border:1px solid var(--ax-line); border-radius:22px; padding:36px;
    display:flex; align-items:center; justify-content:center; min-height:420px; box-shadow:var(--ax-shadow); }
.ax-pd__main img{ max-height:420px; max-width:88%; object-fit:contain; filter:drop-shadow(0 20px 30px rgba(120,85,15,.2)); }
.ax-pd__thumbs{ display:flex; gap:12px; margin-top:16px; flex-wrap:wrap; }
.ax-pd__thumbs .pic{ width:82px; height:82px; border-radius:12px; border:1px solid var(--ax-line); background:#fff; padding:8px; cursor:pointer; transition:.25s ease; }
.ax-pd__thumbs .pic:hover{ border-color:var(--ax-gold-2); transform:translateY(-3px); }
.ax-pd__thumbs .pic img{ width:100%; height:100%; object-fit:contain; }
.ax-pd__title{ font-size:clamp(24px,3vw,34px); font-weight:900; color:var(--ax-ink); line-height:1.15; margin:0 0 16px; }
.ax-pd__meta{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:18px; }
.ax-pd__pill{ background:rgba(199,159,63,.12); border:1px solid rgba(199,159,63,.3); color:var(--ax-gold-1); font-weight:700; font-size:13.5px; padding:9px 15px; border-radius:10px; }
.ax-pd__variants{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:6px 0 22px; }
.ax-pd__variants .ax-vlabel{ font-size:13px; font-weight:800; color:var(--ax-muted); }
.ax-pd__variants h5{ cursor:pointer; margin:0; padding:10px 16px; border-radius:10px; font-size:14px; font-weight:800; color:#fff;
    background:var(--ax-grad); box-shadow:0 8px 18px rgba(199,159,63,.28); transition:transform .25s ease; }
.ax-pd__variants h5:hover{ transform:translateY(-2px); }
.ax-pd__desc{ color:var(--ax-muted); line-height:1.75; font-size:15px; }
.ax-pd__desc .head{ color:var(--ax-ink); font-weight:800; font-size:16px; margin:16px 0 6px; }
.ax-pd__qr{ margin-top:22px; display:flex; align-items:center; gap:14px; }
.ax-pd__qr img{ border:1px solid var(--ax-line); border-radius:12px; padding:6px; background:#fff; width:120px; height:120px; }
.ax-pd__qr span{ font-size:13px; color:var(--ax-muted); font-weight:600; }
@media(max-width:900px){ .ax-pd{ grid-template-columns:1fr; gap:28px; } .ax-pd__main{ min-height:320px; } }

/* blog cards grid */
.ax-blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.ax-blog-card{ background:#fff; border:1px solid var(--ax-line); border-radius:20px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.05);
    transition:transform .5s var(--ax-ease), box-shadow .5s var(--ax-ease); display:flex; flex-direction:column; }
.ax-blog-card:hover{ transform:translateY(-10px); box-shadow:var(--ax-shadow); }
.ax-blog-card__img{ height:210px; overflow:hidden; position:relative; background:#f0ece1; }
.ax-blog-card__img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ax-ease); }
.ax-blog-card:hover .ax-blog-card__img img{ transform:scale(1.08); }
.ax-blog-card__tag{ position:absolute; top:12px; left:12px; background:var(--ax-grad); color:#fff; font-size:11px; font-weight:800; padding:5px 11px; border-radius:8px; }
.ax-blog-card__body{ padding:24px; display:flex; flex-direction:column; flex:1; }
.ax-blog-card__date{ font-size:12px; font-weight:700; color:var(--ax-gold-1); margin-bottom:10px; letter-spacing:.5px; }
.ax-blog-card__body h3{ font-size:18px; font-weight:800; color:var(--ax-ink); margin:0 0 12px; line-height:1.35; }
.ax-blog-card__body p{ font-size:14px; color:var(--ax-muted); line-height:1.6; margin:0 0 18px; }
.ax-blog-card__body a.ax-readmore{ margin-top:auto; color:var(--ax-gold-1); font-weight:800; font-size:13px; text-decoration:none; display:inline-flex; gap:7px; align-items:center; }
.ax-blog-card__body a.ax-readmore:hover{ gap:11px; }
@media(max-width:1024px){ .ax-blog-grid{ grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){ .ax-blog-grid{ grid-template-columns:1fr;} }

/* shop layout (product listing + sidebar) */
.ax-shop-grid{ display:grid; grid-template-columns:1fr 300px; gap:36px; align-items:start; }
.ax-shop-grid .ax-prod-grid{ grid-template-columns:repeat(3,1fr); margin-top:0; }
@media(max-width:1024px){ .ax-shop-grid{ grid-template-columns:1fr; } }
@media(max-width:768px){ .ax-shop-grid .ax-prod-grid{ grid-template-columns:repeat(2,1fr);} }
@media(max-width:520px){ .ax-shop-grid .ax-prod-grid{ grid-template-columns:1fr;} }

/* =====================================================================
   HERO
   ===================================================================== */
.ax-hero{
    position:relative; overflow:hidden;
    min-height:92vh; display:flex; align-items:center;
    padding:120px 0 90px;
    background:#0e0e0e;
    z-index:1;
}
.ax-hero__bg{
    position:absolute; inset:0; z-index:0;
    background-size:cover; background-position:center;
    transform:scale(1.12);
    will-change:transform;
}
.ax-hero__bg::after{
    content:""; position:absolute; inset:0;
    background:
        radial-gradient(1200px 600px at 15% 10%, rgba(199,159,63,.28), transparent 60%),
        linear-gradient(90deg, rgba(10,10,10,.94) 0%, rgba(12,12,12,.82) 45%, rgba(14,14,14,.55) 100%),
        linear-gradient(0deg, rgba(8,8,8,.95), rgba(8,8,8,.2) 55%);
}
.ax-hero__grid{
    position:relative; z-index:2;
    display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center;
    width:min(1180px,92vw); margin:0 auto;
}
.ax-hero__badge{
    display:inline-flex; align-items:center; gap:10px;
    padding:9px 16px; border-radius:50px; margin-bottom:24px;
    background:rgba(199,159,63,.12); border:1px solid rgba(199,159,63,.35);
    color:var(--ax-gold-soft); font-size:13px; font-weight:700; letter-spacing:.5px;
}
.ax-hero__badge .ax-dot{ width:8px; height:8px; border-radius:50%; background:var(--ax-gold-3);
    box-shadow:0 0 0 0 rgba(212,166,59,.7); animation:ax-pulse 2s infinite; }
@keyframes ax-pulse{ 0%{ box-shadow:0 0 0 0 rgba(212,166,59,.6);} 70%{ box-shadow:0 0 0 12px rgba(212,166,59,0);} 100%{ box-shadow:0 0 0 0 rgba(212,166,59,0);} }

.ax-hero h1{
    font-size:clamp(38px,5.8vw,72px); line-height:1.02; font-weight:900;
    letter-spacing:-1.5px; color:#fff; margin:0 0 22px;
}
.ax-hero h1 .ax-hl{
    background:linear-gradient(120deg,var(--ax-gold-soft),var(--ax-gold-3),var(--ax-gold-1));
    -webkit-background-clip:text; background-clip:text; color:transparent;
    display:inline-block;
}
.ax-hero p.ax-hero__sub{
    font-size:clamp(16px,1.7vw,19px); line-height:1.7; color:rgba(255,255,255,.82);
    max-width:520px; margin:0 0 34px;
}
.ax-hero__cta{ display:flex; gap:16px; flex-wrap:wrap; }

.ax-hero__stats{ display:flex; gap:34px; margin-top:46px; flex-wrap:wrap; }
.ax-hero__stat .ax-num{ font-size:34px; font-weight:900; color:#fff; line-height:1; }
.ax-hero__stat .ax-num span{ color:var(--ax-gold-3); }
.ax-hero__stat small{ display:block; margin-top:6px; color:rgba(255,255,255,.6);
    font-size:13px; font-weight:600; letter-spacing:.4px; }

/* floating product card on hero right */
.ax-hero__product{ position:relative; display:flex; justify-content:center; }
.ax-hero__pcard{
    position:relative; width:min(360px,80%); padding:26px;
    border-radius:26px; text-align:center;
    background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 30px 70px rgba(0,0,0,.5);
    backdrop-filter:blur(8px);
    animation:ax-hover 6s ease-in-out infinite;
}
@keyframes ax-hover{ 0%,100%{ transform:translateY(0) rotate(0); } 50%{ transform:translateY(-16px) rotate(-1deg); } }
.ax-hero__pcard::before{
    content:""; position:absolute; inset:-1px; border-radius:26px; padding:1px;
    background:linear-gradient(140deg,rgba(212,166,59,.8),transparent 45%,rgba(212,166,59,.4));
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.ax-hero__pcard img{ width:82%; max-height:300px; object-fit:contain;
    filter:drop-shadow(0 24px 30px rgba(0,0,0,.55)); }
.ax-hero__pcard .ax-tag{
    position:absolute; top:18px; left:18px; z-index:2;
    background:var(--ax-grad); color:#fff; font-size:11px; font-weight:800;
    letter-spacing:1px; padding:6px 12px; border-radius:8px;
}
.ax-hero__pcard h4{ color:#fff; font-size:16px; font-weight:800; margin:14px 0 4px; }
.ax-hero__pcard a.ax-plink{ color:var(--ax-gold-3); font-weight:800; font-size:13px; text-decoration:none; }
.ax-hero__glow{
    position:absolute; width:340px; height:340px; border-radius:50%;
    background:radial-gradient(circle, rgba(199,159,63,.5), transparent 65%);
    filter:blur(20px); z-index:-1; top:50%; left:50%; transform:translate(-50%,-50%);
    animation:ax-breathe 5s ease-in-out infinite;
}
@keyframes ax-breathe{ 0%,100%{ opacity:.55; transform:translate(-50%,-50%) scale(.9);} 50%{ opacity:.9; transform:translate(-50%,-50%) scale(1.1);} }

.ax-hero__scroll{
    position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:3;
    display:flex; flex-direction:column; align-items:center; gap:8px;
    color:rgba(255,255,255,.7); font-size:11px; letter-spacing:2px; text-transform:uppercase;
}
.ax-hero__mouse{ width:24px; height:38px; border:2px solid rgba(255,255,255,.5); border-radius:14px; position:relative; }
.ax-hero__mouse::after{ content:""; position:absolute; left:50%; top:7px; width:4px; height:7px; margin-left:-2px;
    border-radius:2px; background:var(--ax-gold-3); animation:ax-wheel 1.6s infinite; }
@keyframes ax-wheel{ 0%{ opacity:0; transform:translateY(0);} 40%{ opacity:1;} 100%{ opacity:0; transform:translateY(12px);} }

/* wavy oil divider under hero */
.ax-wave{ position:absolute; left:0; right:0; bottom:-1px; z-index:2; line-height:0; }
.ax-wave svg{ width:100%; height:70px; display:block; }

/* ---- Realistic gold oil-splash graphic (uses splashing-oil.png asset) ---- */
.ax-hero__splash{
    position:absolute; z-index:1; right:-3%; bottom:-2%;
    width:min(760px,66%); pointer-events:none; opacity:0;
    filter:drop-shadow(0 24px 50px rgba(199,159,63,.45));
    animation:ax-splash-in 1.5s var(--ax-ease) .3s forwards,
              ax-splash-float 8s ease-in-out 1.8s infinite;
}
@keyframes ax-splash-in{ from{ opacity:0; transform:translateX(60px) scale(.96); }
                         to{ opacity:.96; transform:translateX(0) scale(1); } }
@keyframes ax-splash-float{ 0%,100%{ transform:translateY(0) rotate(0); }
                            50%{ transform:translateY(-16px) rotate(-1.4deg); } }

/* splash accent inside the dark mission section */
.ax-mvv__splash{
    position:absolute; top:-30px; right:-40px; width:min(560px,48%);
    opacity:.45; pointer-events:none; z-index:0; transform:scaleX(-1);
    filter:drop-shadow(0 20px 40px rgba(199,159,63,.4));
    animation:ax-splash-float 9s ease-in-out infinite;
}

/* =====================================================================
   TRUST MARQUEE
   ===================================================================== */
.ax-marquee{
    background:var(--ax-ink); color:#fff; padding:20px 0; overflow:hidden;
    position:relative; z-index:1;
}
.ax-marquee__track{ display:flex; gap:60px; width:max-content; animation:ax-scroll 26s linear infinite; }
.ax-marquee:hover .ax-marquee__track{ animation-play-state:paused; }
.ax-marquee__item{ display:inline-flex; align-items:center; gap:12px; font-size:15px; font-weight:700;
    letter-spacing:1px; color:rgba(255,255,255,.85); white-space:nowrap; }
.ax-marquee__item i{ color:var(--ax-gold-3); font-size:18px; }
@keyframes ax-scroll{ to{ transform:translateX(-50%); } }

/* =====================================================================
   ABOUT
   ===================================================================== */
.ax-about__grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.ax-about__media{ position:relative; }
.ax-about__media img.ax-main{
    width:100%; border-radius:24px; box-shadow:var(--ax-shadow); display:block;
    aspect-ratio:4/3; object-fit:cover;
}
.ax-about__media .ax-globe{
    position:absolute; right:-18px; bottom:-18px; width:120px; height:120px; border-radius:20px;
    background:#fff; box-shadow:var(--ax-shadow); display:flex; align-items:center; justify-content:center;
    animation:ax-hover 7s ease-in-out infinite;
}
.ax-about__media .ax-globe img{ width:66px; animation:ax-spin 20s linear infinite; }
@keyframes ax-spin{ to{ transform:rotate(360deg);} }
.ax-about__media .ax-exp{
    position:absolute; left:-18px; top:-18px; padding:16px 22px; border-radius:16px;
    background:var(--ax-grad); color:#fff; box-shadow:0 18px 40px rgba(199,159,63,.4);
}
.ax-about__media .ax-exp b{ font-size:30px; font-weight:900; display:block; line-height:1; }
.ax-about__media .ax-exp span{ font-size:12px; font-weight:700; letter-spacing:.5px; opacity:.92; }
.ax-about__list{ list-style:none; padding:0; margin:24px 0 32px; display:grid; gap:14px; }
.ax-about__list li{ display:flex; gap:12px; align-items:flex-start; font-weight:600; color:var(--ax-text); }
.ax-about__list li i{ color:var(--ax-gold-1); margin-top:3px; }

/* =====================================================================
   FEATURES  (Why choose)
   ===================================================================== */
.ax-features{ background:linear-gradient(180deg,#fff, var(--ax-cream)); }
.ax-feat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:56px; }
.ax-feat{
    position:relative; background:#fff; border-radius:var(--ax-radius); padding:34px 26px;
    border:1px solid var(--ax-line); box-shadow:0 10px 30px rgba(0,0,0,.05);
    transition:transform .5s var(--ax-ease), box-shadow .5s var(--ax-ease);
    overflow:hidden;
}
.ax-feat::before{
    content:""; position:absolute; left:0; top:0; height:4px; width:100%;
    background:var(--ax-grad); transform:scaleX(0); transform-origin:left;
    transition:transform .5s var(--ax-ease);
}
.ax-feat:hover{ transform:translateY(-12px); box-shadow:var(--ax-shadow); }
.ax-feat:hover::before{ transform:scaleX(1); }
.ax-feat__icon{
    width:64px; height:64px; border-radius:18px; display:flex; align-items:center; justify-content:center;
    font-size:26px; color:#fff; background:var(--ax-grad); margin-bottom:20px;
    box-shadow:0 12px 26px rgba(199,159,63,.35);
    transition:transform .55s cubic-bezier(.34,1.56,.64,1);
}
.ax-feat:hover .ax-feat__icon{ transform:rotate(-8deg) scale(1.08); }
.ax-feat h3{ font-size:18px; font-weight:800; margin:0 0 10px; color:var(--ax-ink); }
.ax-feat p{ font-size:14px; line-height:1.65; color:var(--ax-muted); margin:0; }
.ax-feat__num{ position:absolute; right:18px; top:14px; font-size:44px; font-weight:900;
    color:rgba(199,159,63,.10); line-height:1; }

/* =====================================================================
   COUNTERS BAND (parallax dark)
   ===================================================================== */
.ax-counters{
    position:relative; padding:84px 0; color:#fff; text-align:center; overflow:hidden;
    background:#101010; z-index:1;
}
.ax-counters__bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:.22; z-index:0; }
.ax-counters::after{ content:""; position:absolute; inset:0;
    background:linear-gradient(90deg,rgba(184,135,34,.22),rgba(16,16,16,.7)); z-index:0; }
.ax-counters .ax-wrap{ position:relative; z-index:1; }
.ax-count-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.ax-count b{ font-size:clamp(34px,5vw,54px); font-weight:900; line-height:1;
    background:linear-gradient(120deg,#fff,var(--ax-gold-3)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ax-count span{ display:block; margin-top:10px; font-size:14px; font-weight:600; letter-spacing:.6px; color:rgba(255,255,255,.72); }
.ax-count .ax-plus{ color:var(--ax-gold-3); -webkit-text-fill-color:var(--ax-gold-3); }

/* =====================================================================
   SERVICES
   ===================================================================== */
.ax-serv-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:56px; }
.ax-serv{
    position:relative; padding:36px 26px 30px; border-radius:var(--ax-radius);
    background:#fff; border:1px solid var(--ax-line); text-align:center; overflow:hidden;
    transition:transform .5s var(--ax-ease), box-shadow .5s var(--ax-ease), background .5s ease;
}
.ax-serv:hover{ transform:translateY(-10px); box-shadow:var(--ax-shadow);
    background:linear-gradient(180deg,#fff,#fffdf7); }
.ax-serv__icon{
    width:78px; height:78px; margin:0 auto 22px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; position:relative;
    font-size:28px; color:var(--ax-gold-1);
    background:radial-gradient(circle at 50% 40%, #fff6e3, #f4e6c4);
    transition:transform .55s cubic-bezier(.34,1.56,.64,1);
}
.ax-serv:hover .ax-serv__icon{ transform:translateY(-4px) scale(1.06); color:#fff; background:var(--ax-grad); }
.ax-serv__icon::after{ content:""; position:absolute; inset:0; border-radius:50%; border:2px solid var(--ax-gold-2); opacity:0; }
.ax-serv:hover .ax-serv__icon::after{ animation:ax-ripple .8s ease-out; }
@keyframes ax-ripple{ 0%{ opacity:.6; transform:scale(1);} 100%{ opacity:0; transform:scale(1.6);} }
.ax-serv h3{ font-size:17px; font-weight:800; margin:0 0 10px; color:var(--ax-ink); }
.ax-serv p{ font-size:14px; line-height:1.6; color:var(--ax-muted); margin:0; }

/* =====================================================================
   PRODUCTS SHOWCASE
   ===================================================================== */
.ax-products{ background:linear-gradient(180deg,var(--ax-cream),#fff); }
.ax-prod-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:56px; }
.ax-prod{
    position:relative; background:#fff; border-radius:22px; overflow:hidden;
    border:1px solid var(--ax-line); box-shadow:0 10px 30px rgba(0,0,0,.05);
    transition:transform .55s var(--ax-ease), box-shadow .55s var(--ax-ease);
    display:flex; flex-direction:column;
}
.ax-prod__media{
    position:relative; padding:30px; background:linear-gradient(180deg,#fbf7ec,#fff);
    display:flex; align-items:center; justify-content:center; min-height:250px;
}
.ax-prod__media::before{
    content:""; position:absolute; left:50%; bottom:-30%; width:130%; height:70%;
    transform:translateX(-50%) scale(.5); opacity:0;
    background:radial-gradient(ellipse at center, rgba(199,159,63,.28), transparent 70%);
    transition:opacity .55s ease, transform .55s ease;
}
.ax-prod:hover .ax-prod__media::before{ opacity:1; transform:translateX(-50%) scale(1); }
.ax-prod__media img{ max-height:210px; max-width:88%; object-fit:contain;
    transition:transform .6s var(--ax-ease), filter .6s ease; }
.ax-prod:hover .ax-prod__media img{ transform:scale(1.12) rotate(-2deg);
    filter:drop-shadow(0 18px 22px rgba(120,85,15,.28)); }
.ax-prod__tag{ position:absolute; top:16px; left:16px; z-index:2;
    background:var(--ax-grad); color:#fff; font-size:10.5px; font-weight:800; letter-spacing:.8px;
    padding:5px 11px; border-radius:7px; }
.ax-prod__fav{ position:absolute; top:14px; right:14px; z-index:2; width:36px; height:36px; border-radius:50%;
    background:#fff; box-shadow:0 6px 16px rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center;
    color:var(--ax-gold-1); font-size:14px; }
.ax-prod__body{ padding:20px 22px 24px; text-align:center; display:flex; flex-direction:column; flex:1; }
.ax-prod__body h3{ font-size:15px; font-weight:800; line-height:1.35; color:var(--ax-ink);
    margin:0 0 14px; min-height:42px; display:flex; align-items:center; justify-content:center; }
.ax-prod__rating{ color:var(--ax-gold-3); font-size:12px; margin-bottom:12px; letter-spacing:2px; }
.ax-prod__btn{
    margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:11px 18px; border-radius:12px; font-weight:800; font-size:13.5px; text-decoration:none;
    color:var(--ax-ink); border:1.5px solid var(--ax-gold-2); position:relative; overflow:hidden;
    transition:color .35s ease, background .35s ease;
}
.ax-prod__btn::after{ content:""; position:absolute; inset:0; background:var(--ax-grad); z-index:-1;
    transform:translateY(101%); transition:transform .4s var(--ax-ease); }
.ax-prod:hover{ transform:translateY(-14px); box-shadow:var(--ax-shadow); }
.ax-prod__btn:hover{ color:#fff; }
.ax-prod__btn:hover::after{ transform:translateY(0); }
.ax-prod__btn{ z-index:0; }
.ax-products__all{ text-align:center; margin-top:52px; }

/* =====================================================================
   MISSION / VISION / VALUES
   ===================================================================== */
.ax-mvv{ position:relative; color:#fff; overflow:hidden; background:#111; }
.ax-mvv__bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:.25; }
.ax-mvv::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,12,12,.85),rgba(12,12,12,.94)); }
.ax-mvv .ax-wrap{ position:relative; z-index:1; }
.ax-mvv .ax-title{ color:#fff; }
.ax-mvv .ax-eyebrow{ color:var(--ax-gold-3); }
.ax-mvv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:52px; }
.ax-mvv-card{
    position:relative; padding:38px 30px; border-radius:22px;
    background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
    border:1px solid rgba(255,255,255,.12);
    transition:transform .5s var(--ax-ease), border-color .5s ease, background .5s ease;
}
.ax-mvv-card:hover{ transform:translateY(-10px); border-color:rgba(199,159,63,.55);
    background:linear-gradient(180deg,rgba(199,159,63,.14),rgba(255,255,255,.03)); }
.ax-mvv-card .ax-mvv__ic{ width:60px; height:60px; border-radius:16px; display:flex; align-items:center; justify-content:center;
    font-size:24px; color:#fff; background:var(--ax-grad); margin-bottom:22px; box-shadow:0 12px 26px rgba(199,159,63,.35); }
.ax-mvv-card h3{ font-size:22px; font-weight:900; margin:0 0 12px; color:#fff; }
.ax-mvv-card p{ font-size:14.5px; line-height:1.7; color:rgba(255,255,255,.72); margin:0 0 20px; }
.ax-mvv-card .ax-mvv__links{ display:flex; gap:16px; flex-wrap:wrap; }
.ax-mvv-card .ax-mvv__links a{ color:var(--ax-gold-3); font-weight:800; font-size:13px; text-decoration:none;
    display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.ax-mvv-card .ax-mvv__links a:hover{ color:#fff; }

/* =====================================================================
   CTA SPLASH BAND
   ===================================================================== */
.ax-cta{ position:relative; padding:84px 0; overflow:hidden;
    background:var(--ax-grad); text-align:center; z-index:1; }
.ax-cta::before, .ax-cta::after{ content:""; position:absolute; border-radius:50%;
    background:rgba(255,255,255,.12); }
.ax-cta::before{ width:280px; height:280px; top:-120px; left:-60px; }
.ax-cta::after{ width:220px; height:220px; bottom:-110px; right:-40px; }
.ax-cta .ax-wrap{ position:relative; z-index:1; }
.ax-cta h2{ font-size:clamp(28px,4vw,46px); font-weight:900; color:#111; margin:0 0 14px; letter-spacing:-.5px; }
.ax-cta p{ color:rgba(0,0,0,.7); font-size:17px; font-weight:600; margin:0 0 30px; }
.ax-cta__btns{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* =====================================================================
   LATEST NEWS
   ===================================================================== */
.ax-news-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; margin-top:52px; }
.ax-news{
    display:grid; grid-template-columns:230px 1fr; background:#fff; border-radius:20px; overflow:hidden;
    border:1px solid var(--ax-line); box-shadow:0 10px 30px rgba(0,0,0,.05);
    transition:transform .5s var(--ax-ease), box-shadow .5s var(--ax-ease);
}
.ax-news:hover{ transform:translateY(-8px); box-shadow:var(--ax-shadow); }
.ax-news__img{ position:relative; overflow:hidden; }
.ax-news__img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ax-ease); }
.ax-news:hover .ax-news__img img{ transform:scale(1.08); }
.ax-news__date{ position:absolute; left:12px; top:12px; background:var(--ax-grad); color:#fff;
    font-size:11px; font-weight:800; padding:5px 10px; border-radius:8px; }
.ax-news__body{ padding:24px; display:flex; flex-direction:column; }
.ax-news__body h3{ font-size:17px; font-weight:800; color:var(--ax-ink); margin:0 0 10px; line-height:1.35; }
.ax-news__body p{ font-size:13.5px; line-height:1.6; color:var(--ax-muted); margin:0 0 16px; }
.ax-news__body a{ color:var(--ax-gold-1); font-weight:800; font-size:13px; text-decoration:none;
    margin-top:auto; display:inline-flex; align-items:center; gap:7px; }
.ax-news__body a:hover{ gap:11px; }

/* =====================================================================
   MAP + CONTACT
   ===================================================================== */
.ax-contact{ background:var(--ax-cream); }
.ax-contact__grid{ display:grid; grid-template-columns:400px 1fr; gap:26px; align-items:stretch; margin-top:44px; }
.ax-info-card{ background:#fff; border-radius:22px; padding:12px; border:1px solid var(--ax-line);
    box-shadow:0 14px 40px rgba(0,0,0,.08); display:flex; flex-direction:column; overflow:hidden; }
.ax-info-row{ display:flex; gap:16px; align-items:flex-start; padding:22px 18px; }
.ax-info-row + .ax-info-row{ border-top:1px solid var(--ax-line); }
.ax-info-row .ax-ic{ flex:0 0 46px; width:46px; height:46px; border-radius:13px; display:flex;
    align-items:center; justify-content:center; color:#fff; background:var(--ax-grad); font-size:18px;
    box-shadow:0 10px 22px rgba(199,159,63,.32); }
.ax-info-row h6{ margin:0 0 6px; font-size:11px; font-weight:900; letter-spacing:1px; color:var(--ax-muted); text-transform:uppercase; }
.ax-info-row p, .ax-info-row a{ margin:0; font-size:14px; font-weight:600; color:var(--ax-ink); line-height:1.5; text-decoration:none; }
.ax-info-row a:hover{ color:var(--ax-gold-1); }
.ax-map-frame{ border-radius:22px; overflow:hidden; border:1px solid var(--ax-line); box-shadow:0 14px 40px rgba(0,0,0,.08); min-height:420px; }
.ax-map-frame iframe{ width:100%; height:100%; min-height:420px; border:0; display:block; }

/* =====================================================================
   SUBSCRIBE
   ===================================================================== */
.ax-subscribe{ position:relative; padding:80px 0; overflow:hidden; background:var(--ax-grad); z-index:1; }
.ax-subscribe::before, .ax-subscribe::after{ content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.12); }
.ax-subscribe::before{ width:280px; height:280px; top:-120px; left:-60px; }
.ax-subscribe::after{ width:220px; height:220px; bottom:-110px; right:-40px; }
.ax-subscribe__box{
    width:min(1180px,92vw); margin:0 auto; border-radius:26px; overflow:hidden; position:relative; z-index:1;
    background:var(--ax-ink); padding:48px 46px;
    display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap;
    box-shadow:0 26px 60px rgba(90,60,10,.28);
}
.ax-subscribe__box::before{ content:""; position:absolute; right:-60px; top:-60px; width:260px; height:260px;
    border-radius:50%; background:radial-gradient(circle, rgba(199,159,63,.35), transparent 65%); }
.ax-subscribe__box h3{ position:relative; color:#fff; font-size:clamp(22px,3vw,32px); font-weight:900; margin:0; max-width:420px; line-height:1.15; }
.ax-subscribe__box h3 span{ color:var(--ax-gold-3); }
.ax-subscribe__form{ position:relative; display:flex; gap:12px; flex:1; min-width:280px; justify-content:flex-end; }
.ax-subscribe__form input{ flex:1; max-width:380px; height:54px; padding:0 18px; border:none; border-radius:14px;
    background:#fff; color:#111; font-size:15px; }
.ax-subscribe__form input::placeholder{ color:#9a9a9a; }
.ax-subscribe__form button{ height:54px; padding:0 30px; border:none; border-radius:14px;
    background:var(--ax-grad); color:#fff; font-weight:800; font-size:15px; cursor:pointer; white-space:nowrap;
    transition:transform .3s ease, box-shadow .3s ease; }
.ax-subscribe__form button:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(199,159,63,.4); }

/* =====================================================================
   SCROLL REVEAL PRIMITIVES
   ===================================================================== */
.ax-reveal{ opacity:0; transform:translateY(44px); transition:opacity .9s var(--ax-ease), transform .9s var(--ax-ease); will-change:opacity,transform; }
.ax-reveal.ax-left{ transform:translateX(-56px); }
.ax-reveal.ax-right{ transform:translateX(56px); }
.ax-reveal.ax-zoom{ transform:scale(.9); }
.ax-reveal.ax-in{ opacity:1; transform:translate(0,0) scale(1); }
.ax-stagger > *{ transition-delay:calc(var(--ax-i,0) * 100ms); }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1024px){
    .ax-feat-grid, .ax-serv-grid, .ax-prod-grid{ grid-template-columns:repeat(2,1fr); }
    .ax-count-grid{ grid-template-columns:repeat(2,1fr); gap:40px 20px; }
    .ax-hero__grid{ grid-template-columns:1fr; gap:50px; }
    .ax-hero__product{ order:-1; }
    .ax-hero__splash{ width:min(600px,92%); right:-8%; bottom:auto; top:52%; opacity:.4 !important; }
    .ax-mvv__splash{ width:min(420px,70%); opacity:.3; }
    .ax-mvv-grid{ grid-template-columns:1fr; }
    .ax-about__grid{ grid-template-columns:1fr; gap:70px; }
    .ax-news-grid{ grid-template-columns:1fr; }
    .ax-contact__grid{ grid-template-columns:1fr; }
}
@media (max-width:640px){
    .ax-section{ padding:66px 0; }
    .ax-hero{ min-height:auto; padding:120px 0 70px; text-align:center; }
    .ax-hero__grid{ text-align:center; }
    .ax-hero__cta, .ax-hero__stats{ justify-content:center; }
    .ax-hero__badge{ margin-inline:auto; }
    .ax-feat-grid, .ax-serv-grid, .ax-prod-grid{ grid-template-columns:1fr; }
    .ax-news{ grid-template-columns:1fr; }
    .ax-news__img{ height:200px; }
    .ax-subscribe{ padding:56px 0; }
    .ax-subscribe__box{ padding:34px 24px; }
    .ax-subscribe__form{ flex-direction:column; }
    .ax-subscribe__form input{ max-width:none; }
    .ax-about__media .ax-exp{ padding:12px 16px; }
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
    .ax-oil-field, .ax-hero__glow, .ax-hero__mouse::after{ display:none !important; }
    .ax-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
    .ax-hero__pcard, .ax-about__media .ax-globe, .ax-about__media .ax-globe img,
    .ax-marquee__track, .ax-hero__badge .ax-dot{ animation:none !important; }
    .ax-hero__splash{ animation:none !important; opacity:.9 !important; transform:none !important; }
    .ax-mvv__splash{ animation:none !important; }
}