/*
Theme Name: AMR Emerald Gold
Theme URI: https://demo.almizanrizq.com/
Author: AL MIZAN RIZQ
Description: Premium Emerald Green and Gold WordPress theme with crystal glass effects, glow animations and custom cursor.
Version: 1.0.0
Text Domain: amr-emerald-gold
*/

:root {
    --emerald-950:#02150f;
    --emerald-900:#03281c;
    --emerald-800:#06432e;
    --emerald-700:#08734b;
    --emerald:#10b981;
    --emerald-light:#34d399;
    --gold:#d4af37;
    --gold-light:#f7d774;
    --gold-soft:#fff1ad;
    --white:#f8fafc;
    --muted:#a7b6ae;
    --glass:rgba(255,255,255,.055);
    --glass-border:rgba(212,175,55,.22);
    --shadow:0 25px 80px rgba(0,0,0,.45);
}

*,
*::before,
*::after {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
}

body {
    margin:0;
    color:var(--white);
    background:
        radial-gradient(circle at 15% 10%, rgba(16,185,129,.16), transparent 30%),
        radial-gradient(circle at 85% 20%, rgba(212,175,55,.12), transparent 28%),
        linear-gradient(145deg,var(--emerald-950),#020807 55%,#061a12);
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    line-height:1.7;
    overflow-x:hidden;
}

body::before {
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-1;
    background:
        linear-gradient(120deg,transparent 30%,rgba(255,255,255,.018) 50%,transparent 70%);
    background-size:300% 300%;
    animation:ambientMove 16s ease-in-out infinite;
}

@keyframes ambientMove {
    0%,100% { background-position:0% 50%; }
    50% { background-position:100% 50%; }
}

a {
    color:inherit;
    text-decoration:none;
}

img {
    max-width:100%;
    height:auto;
}

.site-header {
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(2,21,15,.72);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(212,175,55,.15);
}

.header-inner {
    width:min(1200px,92%);
    min-height:76px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.site-brand {
    font-size:1.25rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.site-brand span {
    color:var(--gold-light);
    text-shadow:0 0 22px rgba(247,215,116,.35);
}

.main-nav ul {
    display:flex;
    align-items:center;
    gap:28px;
    margin:0;
    padding:0;
    list-style:none;
}

.main-nav a {
    position:relative;
    color:#dbe8e2;
    transition:.3s ease;
}

.main-nav a::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:-9px;
    width:0;
    height:2px;
    background:linear-gradient(90deg,var(--emerald-light),var(--gold-light));
    box-shadow:0 0 12px rgba(212,175,55,.7);
    transform:translateX(-50%);
    transition:.3s ease;
}

.main-nav a:hover {
    color:#fff;
}

.main-nav a:hover::after {
    width:100%;
}

.hero {
    position:relative;
    min-height:78vh;
    display:flex;
    align-items:center;
    overflow:hidden;
}

.hero::before,
.hero::after {
    content:"";
    position:absolute;
    border-radius:50%;
    filter:blur(2px);
    pointer-events:none;
}

.hero::before {
    width:420px;
    height:420px;
    right:-120px;
    top:50px;
    background:radial-gradient(circle,rgba(16,185,129,.2),transparent 68%);
    animation:orb 8s ease-in-out infinite;
}

.hero::after {
    width:360px;
    height:360px;
    left:-120px;
    bottom:-100px;
    background:radial-gradient(circle,rgba(212,175,55,.16),transparent 68%);
    animation:orb 10s ease-in-out infinite reverse;
}

@keyframes orb {
    0%,100% { transform:translate3d(0,0,0) scale(1); }
    50% { transform:translate3d(0,-25px,0) scale(1.08); }
}

.container {
    width:min(1200px,92%);
    margin:auto;
}

.hero-content {
    position:relative;
    z-index:2;
    max-width:800px;
    padding:100px 0;
}

.eyebrow {
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:8px 14px;
    border:1px solid rgba(212,175,55,.28);
    border-radius:999px;
    background:rgba(255,255,255,.04);
    color:var(--gold-light);
    box-shadow:0 0 30px rgba(212,175,55,.08);
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:.75rem;
    font-weight:700;
}

.eyebrow::before {
    content:"";
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--emerald-light);
    box-shadow:0 0 15px var(--emerald-light);
}

.hero h1 {
    margin:24px 0 18px;
    font-size:clamp(3rem,7vw,6.4rem);
    line-height:.98;
    letter-spacing:-.055em;
}

.hero h1 strong {
    display:block;
    color:transparent;
    background:linear-gradient(110deg,#fff,var(--gold-light) 35%,var(--emerald-light) 72%,#fff);
    background-size:220% auto;
    -webkit-background-clip:text;
    background-clip:text;
    animation:goldFlow 6s linear infinite;
    filter:drop-shadow(0 0 24px rgba(212,175,55,.15));
}

@keyframes goldFlow {
    to { background-position:220% center; }
}

.hero p {
    max-width:680px;
    color:var(--muted);
    font-size:1.12rem;
}

.button-row {
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:34px;
}

.amr-button {
    position:relative;
    isolation:isolate;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 24px;
    border-radius:14px;
    border:1px solid rgba(247,215,116,.38);
    overflow:hidden;
    font-weight:800;
    letter-spacing:.02em;
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}

.amr-button::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(110deg,var(--emerald-800),var(--emerald),var(--gold),var(--emerald-800));
    background-size:250% 100%;
    animation:buttonFlow 5s linear infinite;
}

.amr-button::after {
    content:"";
    position:absolute;
    top:-100%;
    left:-30%;
    width:35%;
    height:300%;
    transform:rotate(25deg);
    background:rgba(255,255,255,.35);
    filter:blur(10px);
    transition:left .6s ease;
}

.amr-button:hover {
    transform:translateY(-4px) scale(1.02);
    border-color:var(--gold-light);
    box-shadow:
        0 12px 35px rgba(16,185,129,.22),
        0 0 35px rgba(212,175,55,.18);
}

.amr-button:hover::after {
    left:120%;
}

.amr-button.secondary {
    background:rgba(255,255,255,.045);
    color:var(--gold-light);
}

.amr-button.secondary::before {
    opacity:0;
}

@keyframes buttonFlow {
    to { background-position:250% 0; }
}

.section {
    padding:100px 0;
}

.section-heading {
    max-width:700px;
    margin-bottom:40px;
}

.section-heading h2 {
    margin:0 0 12px;
    font-size:clamp(2rem,4vw,3.6rem);
    line-height:1.05;
}

.section-heading p {
    color:var(--muted);
}

.crystal-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.crystal-card {
    position:relative;
    isolation:isolate;
    min-height:230px;
    padding:30px;
    border:1px solid var(--glass-border);
    border-radius:24px;
    background:
        linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.025)),
        rgba(2,21,15,.5);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.12);
    overflow:hidden;
    transition:transform .4s ease,border-color .4s ease,box-shadow .4s ease;
}

.crystal-card::before {
    content:"";
    position:absolute;
    inset:-2px;
    z-index:-1;
    background:
        linear-gradient(125deg,transparent 15%,rgba(255,255,255,.13) 48%,transparent 60%);
    transform:translateX(-110%);
    transition:transform .8s ease;
}

.crystal-card::after {
    content:"";
    position:absolute;
    width:150px;
    height:150px;
    right:-70px;
    top:-70px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(16,185,129,.28),transparent 68%);
    filter:blur(8px);
}

.crystal-card:hover {
    transform:translateY(-9px);
    border-color:rgba(247,215,116,.48);
    box-shadow:
        0 30px 90px rgba(0,0,0,.5),
        0 0 45px rgba(16,185,129,.1);
}

.crystal-card:hover::before {
    transform:translateX(110%);
}

.crystal-icon {
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    margin-bottom:20px;
    border-radius:16px;
    color:var(--gold-light);
    background:linear-gradient(145deg,rgba(16,185,129,.18),rgba(212,175,55,.14));
    border:1px solid rgba(212,175,55,.25);
    box-shadow:inset 0 1px rgba(255,255,255,.15),0 0 30px rgba(16,185,129,.12);
}

.crystal-card h3 {
    margin:0 0 8px;
}

.crystal-card p {
    margin:0;
    color:var(--muted);
}

.glow-divider {
    width:100%;
    height:1px;
    margin:0;
    background:linear-gradient(90deg,transparent,var(--gold),var(--emerald),transparent);
    box-shadow:0 0 18px rgba(212,175,55,.3);
}

.site-footer {
    padding:60px 0 35px;
    border-top:1px solid rgba(212,175,55,.14);
    background:rgba(0,0,0,.2);
}

.footer-grid {
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr;
    gap:40px;
}

.footer-grid h3 {
    margin-top:0;
}

.footer-grid p,
.footer-grid a {
    color:var(--muted);
}

.footer-grid a:hover {
    color:var(--gold-light);
}

.copyright {
    margin-top:45px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.07);
    color:#72827b;
    font-size:.9rem;
}

.page-content {
    min-height:70vh;
    padding:100px 0;
}

.cursor-dot,
.cursor-ring {
    position:fixed;
    left:0;
    top:0;
    pointer-events:none;
    z-index:99999;
    transform:translate(-50%,-50%);
}

.cursor-dot {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--gold-light);
    box-shadow:0 0 14px var(--gold-light),0 0 30px var(--emerald-light);
}

.cursor-ring {
    width:34px;
    height:34px;
    border:1px solid rgba(247,215,116,.65);
    border-radius:50%;
    transition:width .2s ease,height .2s ease,border-color .2s ease,background .2s ease;
    box-shadow:0 0 22px rgba(16,185,129,.15);
}

.cursor-ring.hover {
    width:54px;
    height:54px;
    border-color:var(--gold-light);
    background:rgba(212,175,55,.06);
    box-shadow:0 0 35px rgba(16,185,129,.25);
}

.cursor-trail {
    position:fixed;
    width:8px;
    height:8px;
    pointer-events:none;
    z-index:99998;
    border-radius:50%;
    background:radial-gradient(circle,var(--gold-light),var(--emerald),transparent 70%);
    box-shadow:0 0 15px rgba(52,211,153,.8);
    transform:translate(-50%,-50%);
    animation:trailFade .65s ease-out forwards;
}

@keyframes trailFade {
    0% { opacity:.9; transform:translate(-50%,-50%) scale(1.3); }
    100% { opacity:0; transform:translate(-50%,-50%) scale(.05); }
}

@media (max-width:900px) {
    .crystal-grid,
    .footer-grid {
        grid-template-columns:1fr;
    }

    .main-nav {
        display:none;
    }
}

@media (max-width:700px) {
    .hero {
        min-height:auto;
    }

    .hero-content {
        padding:80px 0;
    }

    .hero h1 {
        font-size:clamp(2.8rem,15vw,4.5rem);
    }

    .section {
        padding:70px 0;
    }

    .amr-button {
        width:100%;
    }
}

@media (pointer:coarse) {
    .cursor-dot,
    .cursor-ring,
    .cursor-trail {
        display:none;
    }
}

::selection {
    background:rgba(212,175,55,.35);
    color:#fff;
}

/* =========================================
   PREMIUM NAVIGATION
========================================= */

.main-nav {
    display:flex;
    align-items:center;
    gap:7px;
}

.main-nav a {
    position:relative;
    display:inline-flex;
    align-items:center;
    min-height:40px;
    padding:0 12px;
    border-radius:10px;
    color:#dce9e3;
    font-size:.88rem;
    font-weight:600;
    transition:
        color .3s ease,
        background .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}

.main-nav a::after {
    display:none;
}

.main-nav a:hover {
    color:#fff;
    background:rgba(16,185,129,.10);
    box-shadow:
        inset 0 0 0 1px rgba(52,211,153,.18),
        0 0 20px rgba(16,185,129,.10);
    transform:translateY(-2px);
}

.main-nav a:nth-child(2) {
    color:var(--gold-light);
}

.main-nav a:nth-child(2):hover {
    color:#fff4c4;
    background:rgba(212,175,55,.10);
    box-shadow:
        inset 0 0 0 1px rgba(247,215,116,.22),
        0 0 22px rgba(212,175,55,.12);
}

.cart-count {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:19px;
    height:19px;
    margin-left:6px;
    padding:0 5px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--emerald-light),var(--gold));
    color:#02150f;
    font-size:.68rem;
    font-weight:900;
    line-height:1;
    box-shadow:
        0 0 12px rgba(52,211,153,.35),
        0 0 20px rgba(212,175,55,.15);
}

.header-actions {
    display:flex;
    align-items:center;
    gap:9px;
}

.header-icon-button {
    position:relative;
    width:43px;
    height:43px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(212,175,55,.24);
    border-radius:13px;
    background:rgba(255,255,255,.045);
    font-size:1.05rem;
    transition:.3s ease;
}

.header-icon-button:hover {
    transform:translateY(-3px) scale(1.04);
    border-color:var(--gold-light);
    background:rgba(212,175,55,.09);
    box-shadow:
        0 0 24px rgba(212,175,55,.15),
        inset 0 0 20px rgba(16,185,129,.06);
}

.header-icon-button .cart-count {
    position:absolute;
    right:-5px;
    top:-6px;
    margin:0;
}

.header-gold-button {
    position:relative;
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 17px;
    overflow:hidden;
    border:1px solid rgba(247,215,116,.40);
    border-radius:13px;
    background:
        linear-gradient(
            120deg,
            rgba(16,185,129,.18),
            rgba(212,175,55,.14)
        );
    color:var(--gold-light);
    font-size:.84rem;
    font-weight:800;
    box-shadow:
        0 0 22px rgba(212,175,55,.07),
        inset 0 1px rgba(255,255,255,.12);
    transition:.3s ease;
}

.header-gold-button::before {
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    transform:skewX(-20deg);
    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.32),
        transparent
    );
    transition:left .6s ease;
}

.header-gold-button:hover {
    color:#fff;
    transform:translateY(-3px);
    border-color:var(--gold-light);
    box-shadow:
        0 8px 30px rgba(16,185,129,.16),
        0 0 30px rgba(212,175,55,.15);
}

.header-gold-button:hover::before {
    left:140%;
}

/* Mobile navigation */
@media (max-width:1100px) {

    .main-nav {
        gap:2px;
    }

    .main-nav a {
        padding:0 8px;
        font-size:.8rem;
    }

}

@media (max-width:900px) {

    .header-inner {
        min-height:70px;
    }

    .main-nav {
        display:none;
    }

    .header-actions {
        margin-left:auto;
    }

}

@media (max-width:500px) {

    .header-inner {
        width:94%;
    }

    .site-brand {
        font-size:.95rem;
    }

    .header-gold-button {
        padding:0 12px;
        font-size:.76rem;
    }

    .header-icon-button {
        width:40px;
        height:40px;
    }

}


/* ==========================================================
   AMR FINAL LUXURY HEADER
========================================================== */

.amr-header {
    position: sticky;
    top: 0;
    z-index: 9999;

    background:
        linear-gradient(
            115deg,
            rgba(1,16,11,.98),
            rgba(2,36,25,.97),
            rgba(1,16,11,.98)
        );

    border-bottom: 1px solid rgba(212,175,55,.24);

    box-shadow:
        0 10px 40px rgba(0,0,0,.4),
        0 0 35px rgba(16,185,129,.05);

    backdrop-filter: blur(18px);
}

.amr-header-inner {
    width: min(1510px, 97%);
    min-height: 125px;

    margin: auto;

    display: flex;
    align-items: center;

    gap: 24px;
}


/* LOGO */

.amr-brand {
    width: 175px;
    height: 110px;

    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: center;
}

.amr-brand img {
    width: 170px;
    height: 105px;

    object-fit: contain;

    filter:
        drop-shadow(0 0 10px rgba(212,175,55,.18));

    transition: .35s ease;
}

.amr-brand:hover img {
    transform: scale(1.04);

    filter:
        drop-shadow(0 0 18px rgba(212,175,55,.32));
}


/* NAV */

.amr-navigation {
    flex: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 11px;
}


/* BUTTON */

.amr-menu {
    position: relative;

    width: 106px;
    height: 80px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 7px;

    border: 1px solid rgba(212,175,55,.36);
    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(6,57,39,.82),
            rgba(1,23,16,.92)
        );

    color: #f1f4f0;

    box-shadow:
        inset 0 1px rgba(255,255,255,.07),
        0 5px 20px rgba(0,0,0,.22);

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}

.amr-menu::before {
    content: "";

    position: absolute;

    top: -100%;
    left: -45%;

    width: 35%;
    height: 300%;

    transform: rotate(25deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.22),
            transparent
        );

    transition: left .65s ease;
}

.amr-menu:hover::before {
    left: 135%;
}

.amr-menu:hover {
    transform: translateY(-5px);

    border-color: rgba(247,215,116,.75);

    background:
        linear-gradient(
            145deg,
            rgba(8,82,55,.94),
            rgba(2,31,21,.96)
        );

    box-shadow:
        0 12px 30px rgba(0,0,0,.35),
        0 0 25px rgba(16,185,129,.12),
        0 0 28px rgba(212,175,55,.09);
}


/* ACTIVE HOME */

.amr-menu.active {
    border-color: var(--gold-light);

    box-shadow:
        0 0 25px rgba(212,175,55,.16),
        inset 0 0 25px rgba(16,185,129,.09);
}

.amr-menu.active::after {
    content: "";

    position: absolute;

    bottom: -5px;

    width: 45px;
    height: 4px;

    border-radius: 50%;

    background: var(--gold-light);

    box-shadow:
        0 0 10px var(--gold),
        0 0 22px var(--gold);
}


/* SVG ICON */

.amr-menu-icon {
    position: relative;

    width: 27px;
    height: 27px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--gold-light);
}

.amr-menu-icon svg {
    width: 25px;
    height: 25px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.65;

    stroke-linecap: round;
    stroke-linejoin: round;

    filter:
        drop-shadow(
            0 0 6px rgba(212,175,55,.35)
        );
}

.amr-menu > span:last-child {
    font-size: .66rem;

    font-weight: 850;

    letter-spacing: .045em;

    white-space: nowrap;
}


/* CART BADGE */

.amr-badge {
    position: absolute;

    top: -7px;
    right: -10px;

    width: 20px;
    height: 20px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            var(--emerald-light),
            var(--gold-light)
        );

    color: #02150f;

    font-size: .62rem;

    box-shadow:
        0 0 14px rgba(52,211,153,.5);
}


/* RIGHT */

.amr-right-actions {
    min-width: 190px;

    padding-left: 22px;

    border-left: 1px solid rgba(212,175,55,.24);

    display: flex;
    align-items: center;

    gap: 10px;
}


/* CART */

.amr-cart-button {
    position: relative;

    width: 70px;
    height: 70px;

    display: grid;
    place-items: center;

    border: 1px solid rgba(212,175,55,.45);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(7,65,44,.9),
            rgba(1,25,17,.95)
        );

    color: var(--gold-light);

    transition: .3s ease;
}

.amr-cart-button svg {
    width: 29px;
    height: 29px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.amr-cart-button:hover {
    transform: translateY(-5px);

    border-color: var(--gold-light);

    box-shadow:
        0 12px 30px rgba(0,0,0,.35),
        0 0 25px rgba(212,175,55,.18);
}

.amr-cart-button b {
    position: absolute;

    top: 5px;
    right: 5px;

    width: 20px;
    height: 20px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background: var(--gold-light);

    color: #02150f;

    font-size: .62rem;
}


/* ACCOUNT */

.amr-account-button {
    width: 135px;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    border: 1px solid rgba(247,215,116,.42);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(8,73,49,.9),
            rgba(2,29,20,.95)
        );

    color: var(--gold-light);

    font-size: .77rem;

    font-weight: 900;

    letter-spacing: .06em;

    transition: .3s ease;
}

.amr-account-button svg {
    width: 25px;
    height: 25px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.6;
}

.amr-account-button:hover {
    transform: translateY(-5px);

    color: white;

    border-color: var(--gold-light);

    box-shadow:
        0 12px 35px rgba(0,0,0,.35),
        0 0 30px rgba(212,175,55,.18);
}


/* ==========================================================
   HERO
========================================================== */

.amr-main-hero {
    position: relative;

    min-height: 680px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 72% 50%,
            rgba(16,185,129,.17),
            transparent 31%
        ),
        radial-gradient(
            circle at 28% 55%,
            rgba(212,175,55,.08),
            transparent 32%
        ),
        linear-gradient(
            115deg,
            #01140d,
            #03291c 50%,
            #010b07
        );
}

.amr-hero-background {
    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            125deg,
            transparent 20%,
            rgba(212,175,55,.05) 20.5%,
            transparent 21%
        ),
        linear-gradient(
            55deg,
            transparent 65%,
            rgba(16,185,129,.07) 65.5%,
            transparent 66%
        );

    opacity: .8;
}

.amr-hero-container {
    position: relative;
    z-index: 2;

    width: min(1380px, 95%);

    min-height: 680px;

    margin: auto;

    display: grid;

    grid-template-columns: 1fr 1fr;

    align-items: center;
}


/* LEFT */

.amr-hero-left {
    padding: 60px 20px 50px 40px;

    position: relative;
    z-index: 5;
}

.amr-welcome {
    display: flex;
    align-items: center;

    gap: 15px;

    color: var(--gold-light);

    font-family: Georgia, serif;

    font-size: 1rem;

    letter-spacing: .2em;
}

.amr-welcome i {
    width: 70px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold)
        );
}

.amr-welcome i:last-child {
    background:
        linear-gradient(
            90deg,
            var(--gold),
            transparent
        );
}

.amr-hero-left h1 {
    margin: 20px 0 15px;

    font-family: Georgia, "Times New Roman", serif;

    font-size: clamp(4rem, 7vw, 7.2rem);

    line-height: .82;

    letter-spacing: -.04em;
}

.amr-hero-left h1 strong {
    display: block;

    color: var(--gold-light);

    font-weight: 500;

    text-shadow:
        0 0 20px rgba(212,175,55,.22);
}

.amr-hero-left h1 span {
    display: block;

    color: #f3f4f1;

    font-weight: 500;
}

.amr-title-line {
    width: 450px;
    max-width: 90%;

    height: 1px;

    margin: 25px 0;

    background:
        linear-gradient(
            90deg,
            var(--gold),
            transparent
        );

    box-shadow:
        0 0 12px rgba(212,175,55,.3);
}

.amr-values {
    display: flex;

    align-items: center;

    gap: 12px;

    color: #edf2ee;

    font-size: 1.05rem;

    letter-spacing: .05em;
}

.amr-values b {
    color: var(--gold);
}

.amr-hero-left > p {
    max-width: 590px;

    margin: 22px 0;

    color: #bdcbc4;

    font-size: 1.08rem;

    line-height: 1.7;
}


/* SHOP BUTTON */

.amr-hero-buttons {
    margin-top: 30px;
}

.amr-shop-now {
    position: relative;

    width: 430px;
    max-width: 100%;

    height: 118px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 2px solid var(--gold);

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #073c29,
            #01160f
        );

    color: var(--gold-light);

    overflow: hidden;

    box-shadow:
        0 0 20px rgba(212,175,55,.18),
        inset 0 0 30px rgba(16,185,129,.09);

    transition: .35s ease;
}

.amr-shop-now::before {
    content: "";

    position: absolute;
    inset: 6px;

    border: 1px solid rgba(247,215,116,.32);

    border-radius: 12px;
}

.amr-shop-now::after {
    content: "";

    position: absolute;

    width: 80px;
    height: 220%;

    top: -60%;

    left: -100px;

    transform: rotate(25deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.28),
            transparent
        );

    transition: left .7s ease;
}

.amr-shop-now:hover::after {
    left: 120%;
}

.amr-shop-now:hover {
    transform: translateY(-6px) scale(1.015);

    border-color: #fff0a2;

    box-shadow:
        0 18px 45px rgba(0,0,0,.4),
        0 0 45px rgba(212,175,55,.27),
        0 0 60px rgba(16,185,129,.12);
}

.amr-shop-now small {
    position: relative;
    z-index: 2;

    font-size: .61rem;

    letter-spacing: .16em;

    color: #dbe6e0;
}

.amr-shop-now strong {
    position: relative;
    z-index: 2;

    margin: 3px 0;

    font-family: Georgia, serif;

    font-size: 2.2rem;

    letter-spacing: .08em;
}

.amr-shop-now span {
    position: relative;
    z-index: 2;

    font-size: .65rem;

    letter-spacing: .14em;
}


/* RIGHT CHARACTER */

.amr-hero-right {
    position: relative;

    min-height: 680px;

    display: flex;

    align-items: flex-end;

    justify-content: center;
}

.amr-character-aura {
    position: absolute;

    width: 650px;
    height: 650px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(212,175,55,.18),
            rgba(16,185,129,.10) 38%,
            transparent 70%
        );

    filter: blur(20px);

    animation: amrAura 6s ease-in-out infinite;
}

@keyframes amrAura {

    0%,100% {
        transform: scale(.95);
        opacity: .7;
    }

    50% {
        transform: scale(1.06);
        opacity: 1;
    }

}

.amr-hero-right img {
    position: relative;

    z-index: 3;

    width: min(690px, 100%);

    max-height: 680px;

    object-fit: contain;

    object-position: bottom center;

    filter:
        drop-shadow(
            0 0 28px rgba(212,175,55,.18)
        )
        drop-shadow(
            0 25px 45px rgba(0,0,0,.45)
        );

    animation: amrCharacterFloat 5s ease-in-out infinite;
}

@keyframes amrCharacterFloat {

    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


/* ==========================================================
   TRUST BAR
========================================================== */

.amr-trust {
    position: relative;

    z-index: 10;

    width: min(1480px, 95%);

    margin: -35px auto 0;
}

.amr-trust-box {
    min-height: 110px;

    padding: 20px 35px;

    display: grid;

    grid-template-columns:
        1fr auto
        1fr auto
        1fr auto
        1fr;

    align-items: center;

    border: 1px solid rgba(212,175,55,.28);

    border-radius: 20px;

    background:
        linear-gradient(
            110deg,
            rgba(1,24,16,.96),
            rgba(4,48,32,.88),
            rgba(1,24,16,.96)
        );

    backdrop-filter: blur(20px);

    box-shadow:
        0 20px 50px rgba(0,0,0,.38),
        0 0 30px rgba(16,185,129,.06);
}

.amr-trust-item {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 14px;
}

.amr-trust-item svg {
    width: 43px;
    height: 43px;

    fill: none;

    stroke: var(--gold-light);

    stroke-width: 1.45;

    stroke-linecap: round;
    stroke-linejoin: round;

    filter:
        drop-shadow(
            0 0 8px rgba(212,175,55,.3)
        );
}

.amr-trust-item div {
    display: flex;
    flex-direction: column;
}

.amr-trust-item strong {
    color: #f2f4f1;

    font-size: .72rem;

    letter-spacing: .06em;
}

.amr-trust-item small {
    color: #91a29a;

    font-size: .69rem;
}

.amr-trust-separator {
    width: 1px;
    height: 50px;

    background:
        linear-gradient(
            transparent,
            rgba(212,175,55,.5),
            transparent
        );
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 1300px) {

    .amr-brand {
        width: 140px;
    }

    .amr-brand img {
        width: 140px;
    }

    .amr-navigation {
        gap: 6px;
    }

    .amr-menu {
        width: 88px;
    }

    .amr-menu > span:last-child {
        font-size: .57rem;
    }

    .amr-right-actions {
        min-width: 160px;
        padding-left: 10px;
    }

    .amr-account-button {
        width: 95px;
    }

}

@media (max-width: 1050px) {

    .amr-header-inner {
        min-height: 95px;
    }

    .amr-brand {
        width: 100px;
    }

    .amr-brand img {
        width: 100px;
    }

    .amr-menu {
        width: 65px;
        height: 68px;
    }

    .amr-menu-icon {
        width: 22px;
        height: 22px;
    }

    .amr-menu-icon svg {
        width: 21px;
        height: 21px;
    }

    .amr-menu > span:last-child {
        font-size: .47rem;
    }

    .amr-account-button span {
        display: none;
    }

    .amr-account-button {
        width: 55px;
    }

}

@media (max-width: 850px) {

    .amr-navigation {
        display: none;
    }

    .amr-header-inner {
        justify-content: space-between;
    }

    .amr-main-hero {
        min-height: auto;
    }

    .amr-hero-container {
        grid-template-columns: 1fr;

        min-height: auto;
    }

    .amr-hero-left {
        padding: 80px 20px 20px;

        text-align: center;
    }

    .amr-welcome {
        justify-content: center;
    }

    .amr-title-line {
        margin-left: auto;
        margin-right: auto;
    }

    .amr-values {
        justify-content: center;
    }

    .amr-hero-left > p {
        margin-left: auto;
        margin-right: auto;
    }

    .amr-hero-right {
        min-height: 500px;

        margin-top: -50px;
    }

    .amr-trust-box {
        grid-template-columns: 1fr 1fr;

        gap: 20px;
    }

    .amr-trust-separator {
        display: none;
    }

}

@media (max-width: 550px) {

    .amr-header-inner {
        width: 95%;
    }

    .amr-brand {
        width: 75px;
    }

    .amr-brand img {
        width: 80px;
    }

    .amr-right-actions {
        min-width: auto;
    }

    .amr-cart-button {
        width: 52px;
        height: 52px;
    }

    .amr-account-button {
        width: 52px;
        height: 52px;
    }

    .amr-hero-left h1 {
        font-size: 4rem;
    }

    .amr-shop-now {
        height: 105px;
    }

    .amr-shop-now strong {
        font-size: 1.8rem;
    }

    .amr-hero-right {
        min-height: 390px;
    }

    .amr-trust-box {
        grid-template-columns: 1fr;
    }

}