/*
Theme Name: Aqua Impex
Theme URI: https://aquaimpex.example
Author: Aqua Impex Ornamental Fish Trading LLC
Description: Custom single-page theme for Aqua Impex - ornamental fish, aquariums and aquatic essentials. Dark/light mode toggle, animated page transitions, mobile navigation.
Version: 1.2
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietary - for Aqua Impex use only
Text Domain: aqua-impex
*/

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

:root{--bg:#070708;--bg2:#0d0d0f;--paper:#f7f6f2;--red:#e21a20;--muted:#9b9b9d;--line:rgba(255,255,255,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#fff;font-family:Manrope,Arial,sans-serif;overflow-x:hidden;transition:opacity .42s,background-color .5s ease,color .5s ease}a{text-decoration:none;color:inherit}.noise{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.035}
nav{position:fixed;z-index:70;top:0;left:0;right:0;height:88px;padding:0 5.5vw;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,rgba(7,7,8,.92),transparent);backdrop-filter:blur(8px);transition:background-color .5s ease}
.brand{font:600 22px 'Playfair Display',serif;color:#e21a20}.navlinks{display:flex;gap:30px}.navlinks a,.nav-cta{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#aaa;cursor:pointer;transition:color .5s ease}.navlinks a.active,.navlinks a:hover{color:#fff}.nav-cta{border:1px solid var(--line);padding:13px 18px;border-radius:99px;color:#fff;transition:color .5s ease,border-color .5s ease}.menu{display:none;background:none;border:1px solid var(--line);color:#fff;border-radius:50%;width:44px;height:44px;transition:color .5s ease,border-color .5s ease}
.nav-right{display:flex;align-items:center;gap:14px}.theme-toggle{background:none;border:1px solid var(--line);color:#fff;border-radius:50%;width:44px;height:44px;font-size:16px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:color .5s ease,border-color .5s ease}
.hero{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;padding:150px 7vw 80px;position:relative;overflow:hidden}.hero:after{content:'';position:absolute;width:700px;height:700px;right:-250px;top:10%;background:radial-gradient(circle,rgba(226,26,32,.22),transparent 65%);filter:blur(15px);z-index:-1}
.eyebrow{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:#aaa;transition:color .5s ease}.hero h1,.page-hero h1{font:500 clamp(58px,8vw,124px)/.88 'Playfair Display',serif;letter-spacing:-.06em;margin:22px 0 28px}.hero h1 i,.page-hero h1 i,.contact-hero h2 i{color:var(--red)}.hero p,.page-hero p{font-size:16px;line-height:1.85;color:#aaa;max-width:640px;transition:color .5s ease}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px}.button{display:inline-block;padding:14px 19px;border:1px solid rgba(255,255,255,.22);border-radius:100px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:.3s}.button:hover{transform:translateY(-2px);border-color:#fff}.button.primary{background:var(--red);border-color:var(--red)}
.hero-art{height:min(72vh,700px);min-height:480px;position:relative}.glass{position:absolute;inset:4% 0 4% 7%;border:1px solid rgba(255,255,255,.18);border-radius:34px;overflow:hidden;background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.015));box-shadow:inset 0 0 100px rgba(255,255,255,.025),0 40px 120px rgba(0,0,0,.45);transform:rotateY(-9deg)}.glass:before{content:'';position:absolute;inset:-25%;background:radial-gradient(circle at 50% 45%,rgba(226,26,32,.18),transparent 27%),radial-gradient(circle at 20% 75%,rgba(255,255,255,.08),transparent 20%);animation:water 9s ease-in-out infinite}
.bubble{position:absolute;border:1px solid rgba(255,255,255,.25);border-radius:50%;animation:rise 7s linear infinite}.b1{width:9px;height:9px;left:20%;bottom:15%}.b2{width:6px;height:6px;left:42%;bottom:8%;animation-duration:5s}.b3{width:13px;height:13px;left:76%;bottom:18%;animation-duration:9s}
.stats{display:grid;grid-template-columns:1.3fr 1fr 1fr;background:var(--paper);color:#0b0b0c}.stats>div{padding:70px 7vw;border-right:1px solid #ddd}.stats>div:last-child{border:0}.stats b{display:block;font-size:clamp(48px,6vw,90px);letter-spacing:-.07em}.stats small{display:block;margin-top:10px;font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#777}
.section{padding:125px 7vw;max-width:1500px;margin:auto}.light{background:var(--paper);color:#0b0b0c;max-width:none}.section-head{display:flex;justify-content:space-between;gap:70px;align-items:end;margin-bottom:58px}.section-head h2,.story h2{font:500 clamp(45px,6vw,85px)/.95 'Playfair Display',serif;letter-spacing:-.055em;margin:15px 0 0}.section-head p{max-width:500px;color:#777;line-height:1.8}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tile{min-height:410px;position:relative;overflow:hidden;background:#111113;color:#fff;padding:25px;display:flex;flex-direction:column;justify-content:end;cursor:pointer}.tile .art{position:absolute;inset:0;background:radial-gradient(circle at 70% 35%,rgba(226,26,32,.32),transparent 26%),linear-gradient(145deg,#29292c,#070708);transition:.6s}.tile .a2{background:radial-gradient(circle at 30% 30%,rgba(226,26,32,.2),transparent 30%),linear-gradient(145deg,#080809,#303034)}.tile .a3{background:radial-gradient(circle at 65% 30%,rgba(226,26,32,.24),transparent 25%),linear-gradient(145deg,#242428,#080809)}.tile .a4{background:radial-gradient(circle at 35% 35%,rgba(226,26,32,.25),transparent 26%),linear-gradient(145deg,#111113,#27272a)}.tile:hover .art{transform:scale(1.07)}.tile:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.88))}.tile>*:not(.art){position:relative;z-index:2}.tile>span{position:absolute!important;left:20px;top:20px;font-size:10px;letter-spacing:.18em}.tile h3{font:500 30px/1 'Playfair Display',serif;margin:0 0 9px}.tile p{font-size:12px;line-height:1.6;color:#c6c6c6;margin:0}
.story{background:#0c0c0d;transition:background-color .5s ease}.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.photo-slot{min-height:580px;border:1px dashed rgba(255,255,255,.18);border-radius:30px;display:grid;place-items:center;color:#555;font-size:9px;letter-spacing:.24em;background:radial-gradient(circle at 50% 30%,rgba(226,26,32,.12),transparent 35%),#101012;transition:background-color .5s ease,border-color .5s ease,color .5s ease}.story p{color:#a5a5a7;line-height:1.85;max-width:600px;transition:color .5s ease}.redline{width:60px;height:2px;background:var(--red);margin:24px 0}
.marquee{overflow:hidden;white-space:nowrap;background:#fff;color:#0a0a0b;border-top:1px solid #ddd;border-bottom:1px solid #ddd;font:500 44px 'Playfair Display',serif;padding:17px 0}.marquee i{color:var(--red);font-style:normal;padding:0 25px}
.page-hero{min-height:85svh;display:grid;align-items:center;padding:150px 7vw 90px;position:relative;overflow:hidden}.page-hero:after{content:'';position:absolute;width:750px;height:750px;right:-300px;top:8%;background:radial-gradient(circle,rgba(226,26,32,.2),transparent 65%);z-index:-1}.page-hero p{max-width:680px}.page-hero.center{text-align:center;justify-items:center}
.catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ddd;border:1px solid #ddd}.catalog>div{background:#fff;padding:28px;min-height:125px;display:flex;flex-direction:column;justify-content:space-between}.catalog small{font-size:9px;color:#aaa;letter-spacing:.18em}.catalog strong{font-size:15px}
.fish-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.fish-card{height:340px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.13);background:linear-gradient(145deg,#1b1b1d,#050506);padding:25px}.fish-card:before{content:'';position:absolute;width:300px;height:300px;right:-80px;top:-70px;border-radius:50%;background:radial-gradient(circle,rgba(226,26,32,.25),transparent 65%)}.fish-card:after{content:'';position:absolute;width:150%;height:1px;background:rgba(255,255,255,.12);left:-20%;top:48%;transform:rotate(-17deg)}.fish-card h3{position:absolute;left:25px;bottom:52px;right:20px;font:500 30px/1.05 'Playfair Display',serif}.fish-card span{position:absolute;left:25px;bottom:24px;color:#777;font-size:9px;letter-spacing:.18em;text-transform:uppercase}
.systems{display:grid;grid-template-columns:1.1fr 1fr;gap:80px}.equipment{display:grid;grid-template-columns:1fr 1fr;gap:10px}.equipment>div{padding:22px;border:1px solid rgba(255,255,255,.1);transition:.3s}.equipment>div:hover{border-color:var(--red);transform:translateX(5px)}.equipment small{display:block;color:#666;font-size:9px;letter-spacing:.18em;margin-bottom:8px}.equipment b{font-size:14px;font-weight:500}
.contact-hero{min-height:75svh;display:grid;place-items:center;text-align:center;padding:140px 7vw 80px}.contact-hero h2{font:500 clamp(68px,10vw,145px)/.86 'Playfair Display',serif;letter-spacing:-.065em;margin:20px 0 30px}.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);background:#ddd;gap:1px}.contact-cards>a,.contact-cards>div{background:#fff;color:#0b0b0c;padding:42px;min-height:220px}.contact-cards small{font-size:9px;letter-spacing:.18em;color:#888}.contact-cards strong{display:block;font-size:19px;margin-top:18px}.contact-cards p{color:#666;line-height:1.6}.muted{color:#999}
.float{position:fixed;z-index:65;right:24px;bottom:24px;display:flex;flex-direction:column;gap:9px}.float a{width:48px;height:48px;border-radius:50%;background:var(--red);display:grid;place-items:center;color:#fff;font-size:10px;font-weight:700;box-shadow:0 15px 35px rgba(0,0,0,.35)}footer{padding:45px 7vw;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;color:#666;font-size:9px;letter-spacing:.15em;text-transform:uppercase;transition:border-color .5s ease}.reveal{opacity:0;transform:translateY(25px);transition:.8s}.reveal.in{opacity:1;transform:none}
@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-450px);opacity:0}}@keyframes water{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
@media(max-width:950px){.navlinks,.nav-cta{display:none}.menu{display:block}.hero{grid-template-columns:1fr;padding:120px 6vw 70px}.hero-art{order:-1;height:460px;min-height:0}.glass{inset:2% 2% 2% 0}.stats{grid-template-columns:1fr}.stats>div{border-right:0;border-bottom:1px solid #ddd;padding:45px 6vw}.grid4{grid-template-columns:1fr 1fr}.story-grid,.systems{grid-template-columns:1fr;gap:45px}.photo-slot{min-height:420px}.catalog{grid-template-columns:1fr 1fr}.fish-grid{grid-template-columns:1fr 1fr}.section{padding:90px 6vw}}
@media(max-width:600px){.hero h1,.page-hero h1{font-size:58px}.hero p,.page-hero p{font-size:14px}.grid4,.catalog,.fish-grid,.equipment{grid-template-columns:1fr}.tile{min-height:330px}.fish-card{height:280px}.section-head{display:block}.section-head p{margin-top:25px}.story h2{font-size:45px}.contact-hero h2{font-size:70px}footer{flex-direction:column;gap:14px;padding:35px 6vw}.float{right:16px;bottom:16px}}

/* --- fixes: infinite marquee loop --- */
.marquee-track{display:inline-block;animation:marquee 26s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* --- fixes: working mobile navigation overlay --- */
.mobile-nav{position:fixed;inset:0;z-index:82;background:rgba(7,7,8,.98);backdrop-filter:blur(10px);display:flex;flex-direction:column;justify-content:center;gap:22px;padding:0 9vw;opacity:0;pointer-events:none;transform:translateY(-14px);transition:opacity .35s ease,transform .35s ease,background-color .5s ease}
.mobile-nav.open{opacity:1;pointer-events:auto;transform:none}
.mobile-nav a{font:500 40px/1 'Playfair Display',serif;color:#fff;letter-spacing:-.02em;transition:color .5s ease}
.mobile-nav a.active{color:var(--red)}
.mobile-nav .button{margin-top:14px;align-self:flex-start}
.mobile-nav .theme-toggle{margin-top:6px;width:52px;height:52px;font-size:20px}
.mobile-nav-close{position:absolute;top:22px;right:5.5vw;background:none;border:1px solid var(--line);color:#fff;border-radius:50%;width:44px;height:44px;font-size:16px;cursor:pointer;transition:color .5s ease,border-color .5s ease}

/* --- addition: brand loader shown briefly on page/tab transitions --- */
.route-loader{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 45%,rgba(226,26,32,.18),transparent 60%),var(--bg);opacity:0;pointer-events:none;transition:opacity .28s ease}
.route-loader.show{opacity:1;pointer-events:auto}
.route-loader-logo{width:104px;height:auto;filter:drop-shadow(0 18px 40px rgba(226,26,32,.35));animation:loaderSwim 1.1s cubic-bezier(.45,0,.2,1) infinite}
@keyframes loaderSwim{0%,100%{transform:translateY(0) scale(1) rotate(-4deg)}50%{transform:translateY(-7px) scale(1.06) rotate(4deg)}}
@media(max-width:600px){.mobile-nav a{font-size:32px}.route-loader-logo{width:84px}}

/* --- addition: real photography for the placeholder tiles/cards --- */
.tile .art.ph-fish{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/ornamental-fish.jpg');background-size:cover;background-position:center}
.tile .art.ph-aquariums{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/aquariums.jpg');background-size:cover;background-position:center}
.tile .art.ph-equipment{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/equipment.jpg');background-size:cover;background-position:center}
.tile .art.ph-aquascaping{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/aquascaping.jpg');background-size:cover;background-position:center}
.tile .art.ph-selection{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/selection.jpg');background-size:cover;background-position:center}
.tile .art.ph-care{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/care.jpg');background-size:cover;background-position:center}
.tile .art.ph-service{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/service.jpg');background-size:cover;background-position:center}
.tile .art.ph-growth{background-image:radial-gradient(circle at 70% 35%,rgba(226,26,32,.3),transparent 45%),url('images/growth.jpg');background-size:cover;background-position:center}
.photo-slot.ph-ceo{background-image:radial-gradient(circle at 50% 30%,rgba(226,26,32,.12),transparent 35%),url('images/ceo.jpg');background-size:cover;background-position:center 18%;color:transparent}
.fish-card.ph-discus{background-image:linear-gradient(180deg,rgba(5,5,6,.05) 0%,rgba(5,5,6,.4) 45%,rgba(5,5,6,.92) 100%),url('images/fishcard-discus.jpg');background-size:cover;background-position:center}
.fish-card.ph-arowana{background-image:linear-gradient(180deg,rgba(5,5,6,.05) 0%,rgba(5,5,6,.4) 45%,rgba(5,5,6,.92) 100%),url('images/fishcard-arowana.jpg');background-size:cover;background-position:center}
.fish-card.ph-betta{background-image:linear-gradient(180deg,rgba(5,5,6,.05) 0%,rgba(5,5,6,.4) 45%,rgba(5,5,6,.92) 100%),url('images/fishcard-betta.jpg');background-size:cover;background-position:center}
.fish-card.ph-discus span,.fish-card.ph-arowana span,.fish-card.ph-betta span{color:transparent}

/* --- addition: light mode (default is dark; toggled via the sun/moon button) --- */
body[data-theme="light"]{background:var(--paper);color:#0b0b0c}
body[data-theme="light"] nav{background:linear-gradient(180deg,rgba(247,246,242,.92),transparent)}
body[data-theme="light"] .navlinks a,body[data-theme="light"] .nav-cta{color:#666}
body[data-theme="light"] .navlinks a.active,body[data-theme="light"] .navlinks a:hover{color:#0b0b0c}
body[data-theme="light"] .nav-cta{border-color:rgba(0,0,0,.18);color:#0b0b0c}
body[data-theme="light"] .menu{border-color:rgba(0,0,0,.18);color:#0b0b0c}
body[data-theme="light"] .theme-toggle{border-color:rgba(0,0,0,.18);color:#0b0b0c}
body[data-theme="light"] .eyebrow{color:#777}
body[data-theme="light"] .hero p,body[data-theme="light"] .page-hero p{color:#555}
body[data-theme="light"] .button{border-color:rgba(0,0,0,.2)}
body[data-theme="light"] .button:hover{border-color:#0b0b0c}
body[data-theme="light"] .story{background:#efeeea}
body[data-theme="light"] .story p{color:#555}
body[data-theme="light"] .photo-slot{border-color:rgba(0,0,0,.18);color:#888;background:radial-gradient(circle at 50% 30%,rgba(226,26,32,.1),transparent 35%),#efeeea}
body[data-theme="light"] .photo-slot.ph-ceo{color:transparent;background-image:radial-gradient(circle at 50% 30%,rgba(226,26,32,.08),transparent 35%),url('images/ceo.jpg');background-size:cover;background-position:center 18%}
body[data-theme="light"] footer{border-top-color:rgba(0,0,0,.12)}
body[data-theme="light"] .mobile-nav{background:rgba(247,246,242,.98)}
body[data-theme="light"] .mobile-nav a{color:#0b0b0c}
body[data-theme="light"] .mobile-nav a.active{color:var(--red)}
body[data-theme="light"] .mobile-nav-close{border-color:rgba(0,0,0,.18);color:#0b0b0c}
body[data-theme="light"] .equipment>div{border-color:rgba(0,0,0,.12)}
body[data-theme="light"] .equipment small{color:#777}
body[data-theme="light"] .noise{opacity:.02}


/* --- WordPress admin bar compatibility (only affects logged-in admins) --- */
body.admin-bar nav{top:32px}
body.admin-bar .route-loader,body.admin-bar .mobile-nav{top:32px;height:calc(100% - 32px)}
@media screen and (max-width:782px){
  body.admin-bar nav{top:46px}
  body.admin-bar .route-loader,body.admin-bar .mobile-nav{top:46px;height:calc(100% - 46px)}
}

/* --- addition: catalog photos (Fish page 15-item list) --- */
.catalog>div.cat-item{background-size:cover;background-position:center;color:#fff}
.catalog>div.cat-item small{color:rgba(255,255,255,.8)}
.catalog>div.cat-item strong{color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.catalog>div.cat-tetra{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-tetra.jpg')}
.catalog>div.cat-guppy{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-guppy.jpg')}
.catalog>div.cat-arowana{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-arowana.jpg')}
.catalog>div.cat-goldfish{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-goldfish.jpg')}
.catalog>div.cat-angelfish{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-angelfish.jpg')}
.catalog>div.cat-discus{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-discus.jpg')}
.catalog>div.cat-shrimp{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-shrimp.jpg')}
.catalog>div.cat-betta{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-betta.jpg')}
.catalog>div.cat-algae{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-algae.jpg')}
.catalog>div.cat-gourami{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-gourami.jpg')}
.catalog>div.cat-rainbow{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-rainbow.jpg')}
.catalog>div.cat-malawi{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-malawi.jpg')}
.catalog>div.cat-turtle{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-turtle.jpg')}
.catalog>div.cat-preorder{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-preorder.jpg')}
.catalog>div.cat-allother{background-image:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.82) 100%),url('images/cat-allother.jpg')}
