/*
Theme Name: SuMeNi Coming Soon
Theme URI: https://sumeni.com/
Author: SuMeNi Global Venture
Description: A responsive branded coming-soon landing page for SuMeNi Global Venture.
Version: 1.0.0
Text Domain: sumeni-coming-soon
*/

:root { --forest:#103f35; --espresso:#26150f; --mocha:#43251a; --roast:#5c3522; --caramel:#c9894f; --cream:#fff6e8; --latte:#f0d6b1; --ink:#281610; --muted:#8f6d5b; }
* { box-sizing:border-box; }
html { min-height:100%; background:var(--espresso); }
body { min-height:100vh; margin:0; overflow-x:hidden; color:var(--cream); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:radial-gradient(circle at 84% 9%,rgba(201,137,79,.28),transparent 23rem),radial-gradient(circle at 7% 84%,rgba(240,214,177,.12),transparent 27rem),linear-gradient(135deg,#3c2117 0%,#27150f 55%,#160b08 100%); }
body::before,body::after { content:""; position:fixed; border:1px solid rgba(255,231,194,.16); border-radius:50%; pointer-events:none; }
body::before { width:44rem; height:44rem; right:-24rem; top:-19rem; }
body::after { width:38rem; height:38rem; left:-25rem; bottom:-21rem; }
.page { position:relative; width:100%; min-height:100vh; margin:0; padding:34px clamp(24px,8vw,150px) 28px; display:flex; flex-direction:column; isolation:isolate; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:12px; padding:7px 13px 7px 8px; background:rgba(255,246,232,.96); border-radius:12px; box-shadow:0 10px 25px rgba(0,0,0,.22); text-decoration:none; }
.brand-emblem { width:53px; height:53px; object-fit:contain; }
.brand-copy { display:flex; flex-direction:column; justify-content:center; color:var(--forest); }
.brand-name { font-family:Georgia,"Times New Roman",serif; font-size:28px; line-height:.88; letter-spacing:-1.7px; font-weight:700; }
.brand-sub { margin-top:7px; font-size:8px; line-height:1; letter-spacing:.25em; font-weight:800; }
.status { display:flex; align-items:center; gap:9px; padding:9px 12px; color:#f8dfbd; background:rgba(255,239,215,.08); border:1px solid rgba(255,232,195,.16); border-radius:999px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.pulse { width:7px; height:7px; border-radius:50%; background:#d9a15f; box-shadow:0 0 0 0 rgba(217,161,95,.75); animation:pulse 2s infinite; }
main { flex:1; display:grid; align-items:center; grid-template-columns:1.22fr .78fr; gap:clamp(36px,8vw,120px); padding:clamp(64px,11vh,116px) 0 44px; }
.eyebrow { margin:0 0 19px; color:#dfae78; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.18em; }
h1 { max-width:760px; margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(53px,7vw,92px); line-height:.98; letter-spacing:-.058em; font-weight:500; }
h1 em { color:#f3d1a0; font-style:italic; }
.lead { max-width:565px; margin:27px 0 0; color:#ead8c4; font-size:clamp(16px,1.55vw,19px); line-height:1.65; }
.side { position:relative; min-height:365px; display:grid; place-items:center; }
.halo { position:absolute; width:min(31vw,365px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 34% 30%,rgba(244,202,142,.34),rgba(166,96,52,.14) 35%,transparent 67%); filter:blur(.2px); }
.orb { position:relative; width:min(28vw,318px); min-width:260px; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(255,223,177,.30); background:linear-gradient(145deg,rgba(255,231,198,.17),rgba(117,61,35,.18)); box-shadow:inset 10px 10px 28px rgba(255,231,198,.07),inset -20px -25px 40px rgba(0,0,0,.25),0 25px 60px rgba(0,0,0,.28); backdrop-filter:blur(8px); }
.orb::before,.orb::after { content:""; position:absolute; border:1px solid rgba(255,226,188,.28); border-radius:50%; }
.orb::before { inset:16px; border-style:dashed; animation:spin 22s linear infinite; }
.orb::after { width:120%; height:45%; transform:rotate(-28deg); }
.orb svg { position:relative; z-index:1; width:41%; overflow:visible; fill:none; stroke:#ffe5bd; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 6px 8px rgba(0,0,0,.25)); }
.tag { position:absolute; z-index:2; display:flex; align-items:center; gap:8px; padding:10px 13px; color:#f4dfc4; background:rgba(53,29,20,.83); border:1px solid rgba(255,224,182,.20); border-radius:10px; box-shadow:0 12px 25px rgba(0,0,0,.2); backdrop-filter:blur(10px); font-size:11px; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }
.tag-one { top:9%; right:-7%; } .tag-two { bottom:10%; left:-8%; } .tag i { width:6px; height:6px; background:#d49a5a; border-radius:50%; }
footer { display:flex; align-items:end; justify-content:space-between; gap:20px; color:#d0b9a5; font-size:12px; }
.line { flex:1; max-width:380px; height:1px; background:linear-gradient(90deg,rgba(244,211,170,.44),transparent); }
.socials { display:flex; gap:16px; } .socials a { color:#f0d7b7; text-decoration:none; border-bottom:1px solid transparent; } .socials a:hover { border-color:#d49a5a; }
@keyframes spin { to { transform:rotate(360deg); } } @keyframes pulse { 70% { box-shadow:0 0 0 8px rgba(146,209,145,0); } 100% { box-shadow:0 0 0 0 rgba(146,209,145,0); } }
@media (max-width:760px) { .page { padding-top:24px; } .brand-emblem { width:47px; height:47px; } .brand-name { font-size:25px; } .status { font-size:9px; } main { grid-template-columns:1fr; padding:63px 0 44px; gap:19px; } .side { order:-1; min-height:230px; } .orb { width:220px; min-width:220px; } .halo { width:280px; } .tag-one { right:1%; top:2%; } .tag-two { left:1%; bottom:1%; } h1 { font-size:clamp(48px,15vw,70px); } footer { align-items:flex-start; flex-direction:column; } .line { width:100%; } }
@media (max-width:470px) { .brand { gap:9px; padding:6px 10px 6px 7px; } .brand-emblem { width:42px; height:42px; } .brand-name { font-size:22px; } .brand-sub { font-size:7px; } .status { display:none; } footer { gap:14px; } }