@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root{
    --bg:#05060A;
    --bg-alt:#0A0B12;
    --panel:rgba(255,255,255,.04);
    --panel-strong:rgba(255,255,255,.065);
    --border:rgba(255,255,255,.09);
    --sun:#F5A557;
    --sun-soft:#FFD68A;
    --day:#6FA3E0;
    --night:#4A5164;
    --blob-blue:#4B5FE0;
    --blob-teal:#14C79A;
    --blob-magenta:#C13BD6;
    --text:#F4F5F8;
    --muted:#9096A8;
    --radius:20px;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
    background:var(--bg);
    background-image:
        radial-gradient(circle at 6% 0%, rgba(75,95,224,.32), transparent 42%),
        radial-gradient(circle at 46% 30%, rgba(20,199,154,.16), transparent 45%),
        radial-gradient(circle at 96% 92%, rgba(193,59,214,.30), transparent 42%),
        radial-gradient(circle at 90% 6%, rgba(245,165,87,.10), transparent 35%);
    background-attachment:fixed;
    color:var(--text);
    font-family:'Manrope',Arial,sans-serif;
    line-height:1.6;
}

a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
ul{list-style:none;}

.container{width:90%;max-width:1180px;margin:auto;}

.mono{font-family:'Space Mono',monospace;}

/* ============ HEADER ============ */

header{
    position:fixed;top:16px;left:50%;
    transform:translateX(-50%);
    width:92%;max-width:1180px;
    z-index:1000;
    background:rgba(14,15,22,.78);
    backdrop-filter:blur(16px);
    border:1px solid var(--border);
    border-radius:20px;
    box-shadow:0 12px 30px rgba(0,0,0,.35);
}

.nav{display:flex;justify-content:space-between;align-items:center;padding:16px 26px;}
header .container{width:100%;max-width:none;}

.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:19px;letter-spacing:.2px;}
.brand img{width:34px;border-radius:8px;}

nav.links{display:flex;gap:34px;}
nav.links a{color:var(--muted);font-weight:500;font-size:15px;transition:color .2s;}
nav.links a:hover{color:var(--text);}

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

.hero{padding:190px 0 110px;}

.hero-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:70px;
    align-items:center;
}

.eyebrow{
    color:var(--sun);
    font-weight:600;
    font-size:14px;
    margin-bottom:18px;
}

.hero h1{
    font-size:60px;
    font-weight:800;
    line-height:1.05;
    letter-spacing:-1px;
    margin-bottom:22px;
}

.hero-lead{
    color:var(--muted);
    font-size:18px;
    max-width:480px;
    margin-bottom:38px;
}

.cta-row{display:flex;gap:16px;margin-bottom:44px;flex-wrap:wrap;}

.btn{
    display:inline-block;
    background:var(--sun);
    color:#1A1102;
    padding:15px 26px;
    border-radius:14px;
    font-weight:700;
    transition:transform .2s, box-shadow .2s;
    box-shadow:0 8px 24px rgba(245,165,87,.22);
}
.btn:hover{transform:translateY(-2px);}

.btn-ghost{
    display:inline-block;
    padding:15px 26px;
    border-radius:14px;
    border:1px solid var(--border);
    color:var(--text);
    font-weight:600;
    background:var(--panel);
    transition:border-color .2s;
}
.btn-ghost:hover{border-color:rgba(255,255,255,.25);}

.hero-specs{display:flex;gap:30px;color:var(--muted);font-size:14px;flex-wrap:wrap;}
.hero-specs span{display:flex;align-items:center;gap:8px;}
.dot{width:6px;height:6px;border-radius:50%;background:var(--sun);display:inline-block;}

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

.hero-photo{position:relative;display:flex;flex-direction:column;align-items:center;}

.hero-photo::before{
    content:"";
    position:absolute;
    inset:-10%;
    background:radial-gradient(circle at 35% 20%, rgba(75,95,224,.30), transparent 55%),
               radial-gradient(circle at 70% 85%, rgba(193,59,214,.24), transparent 55%);
    filter:blur(18px);
    z-index:0;
}

.hero-photo img{
    position:relative;
    z-index:1;
    width:100%;
    max-width:420px;
    height:auto;
    margin:auto;
    border-radius:20px;
    box-shadow:0 30px 60px rgba(0,0,0,.45);
}

.live-badge{
    position:relative;
    z-index:1;
    margin-top:-24px;
    background:#0D0E14;
    border:1px solid var(--border);
    box-shadow:0 10px 24px rgba(0,0,0,.35);
    padding:10px 20px;
    border-radius:999px;
    font-size:13px;
    color:#C3C9DA;
    display:flex;
    align-items:center;
    gap:10px;
}

.live-badge .hero-clock{color:var(--text);font-weight:700;}
.live-badge .live-dot{
    width:7px;height:7px;border-radius:50%;
    background:var(--sun);
    box-shadow:0 0 6px var(--sun);
    animation:pulse 2.4s ease-in-out infinite;
}

@keyframes pulse{
    0%,100%{opacity:1;}
    50%{opacity:.35;}
}

/* ============ SECTIONS ============ */

.section{padding:110px 0;}
.section-alt{background:rgba(255,255,255,.015);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}

.section-head{max-width:560px;margin-bottom:60px;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-size:38px;font-weight:800;letter-spacing:-.5px;margin-bottom:14px;}
.section-head p{color:var(--muted);font-size:16px;}

/* cycle timeline (genuine sequence: hours of the day) */

.cycle{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.cycle-step{
    background:#0D0E14;
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:30px 24px;
    position:relative;
}

.cycle-step .time{font-family:'Space Mono',monospace;color:var(--sun);font-size:14px;margin-bottom:14px;display:block;}
.cycle-step h3{font-size:18px;margin-bottom:10px;}
.cycle-step p{color:var(--muted);font-size:14px;}

/* specs */

.spec-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}

.spec-card{
    background:#0D0E14;
    border:1px solid var(--border);
    border-radius:18px;
    padding:26px;
}
.spec-card span{display:block;color:var(--muted);font-size:13px;margin-bottom:10px;}
.spec-card strong{font-family:'Space Mono',monospace;font-size:16px;font-weight:700;}

/* atelier */

.atelier{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:center;}

.atelier-img{position:relative;}
.atelier-img img{border-radius:22px;border:1px solid var(--border);}

.atelier h2{font-size:36px;font-weight:800;letter-spacing:-.5px;margin-bottom:20px;}
.atelier .lead{font-size:19px;font-weight:600;margin-bottom:16px;}
.atelier p{color:var(--muted);margin-bottom:16px;}

.invest{
    background:#12141C;
    border:1px solid var(--border);
    border-left:3px solid var(--sun);
    border-radius:16px;
    padding:24px;
    margin:26px 0;
}
.invest h3{color:var(--sun);font-size:17px;margin-bottom:8px;}
.invest p{color:var(--muted);margin:0;}

.tag-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.tag-list li{
    border:1px solid var(--border);
    background:#0D0E14;
    padding:8px 14px 8px 12px;
    border-radius:999px;
    font-size:13px;
    color:var(--muted);
    display:flex;
    align-items:center;
    gap:8px;
}
.tag-list li::before{
    content:"";
    width:7px;height:7px;border-radius:50%;
    background:var(--blob-blue);
    flex-shrink:0;
}
.tag-list li:nth-child(2)::before{background:var(--blob-teal);}
.tag-list li:nth-child(3)::before{background:var(--sun);}
.tag-list li:nth-child(4)::before{background:var(--blob-magenta);}

/* contact */

.contact{text-align:center;}
.contact h2{font-size:38px;font-weight:800;margin-bottom:16px;}
.contact p{color:var(--muted);max-width:520px;margin:0 auto 32px;}

/* footer */

footer{padding:36px 0;border-top:1px solid var(--border);}
.footer-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;}
.footer-row p{color:var(--muted);font-size:14px;}
.footer-links{display:flex;gap:22px;flex-wrap:wrap;}
.footer-links a{color:var(--muted);font-size:14px;transition:color .2s;}
.footer-links a:hover{color:var(--text);}

/* legal pages */

.legal{padding:170px 0 100px;}
.legal-box{
    max-width:820px;margin:auto;
    background:#0D0E14;
    border:1px solid var(--border);
    border-radius:24px;
    padding:54px;
}
.legal-box h1{font-size:34px;margin-bottom:26px;}
.legal-box h2{font-size:19px;margin:30px 0 10px;color:var(--sun);}
.legal-box p{color:var(--muted);}

/* map page */

.map-page{padding:170px 0 100px;}

.map-layout{
    display:grid;
    grid-template-columns:1fr 320px;
    gap:28px;
    align-items:start;
}

#map{
    height:560px;
    width:100%;
    border-radius:var(--radius);
    border:1px solid var(--border);
    background:var(--bg-alt);
    overflow:hidden;
}

.leaflet-tile-pane{
    filter:invert(1) hue-rotate(180deg) brightness(.95) contrast(.9) saturate(.35);
}

.leaflet-popup-content-wrapper{
    background:#12172A;
    color:var(--text);
    border:1px solid var(--border);
    border-radius:12px;
}
.leaflet-popup-tip{background:#12172A;}
.leaflet-popup-content strong{display:block;margin-bottom:4px;}
.leaflet-popup-content span{color:var(--muted);font-size:13px;}
.leaflet-control-attribution{
    background:rgba(9,13,22,.7) !important;
    color:var(--muted) !important;
}
.leaflet-control-attribution a{color:var(--muted) !important;}

.map-legend{
    background:#0D0E14;
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:26px;
}
.map-legend h3{font-size:16px;margin-bottom:18px;}
.map-legend ul{display:flex;flex-direction:column;gap:14px;margin-bottom:22px;}
.map-legend li{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;}
.legend-swatch{width:12px;height:12px;border-radius:50%;flex-shrink:0;}
.legend-swatch.atelier{background:var(--sun);box-shadow:0 0 6px var(--sun);}
.legend-swatch.vendu{background:var(--blob-teal);}

.map-legend p{color:var(--muted);font-size:13px;line-height:1.7;}

/* responsive */

@media(max-width:900px){
    nav.links{display:none;}
    header{top:10px;width:94%;}
    .hero{padding:150px 0 70px;}
    .hero-grid,.atelier,.spec-grid{grid-template-columns:1fr;}
    .cycle{grid-template-columns:1fr 1fr;}
    .hero h1{font-size:42px;}
    .section-head h2{font-size:30px;}
    .legal-box{padding:30px;}
    .map-layout{grid-template-columns:1fr;}
    #map{height:420px;}
}

@media(prefers-reduced-motion:reduce){
    *{animation:none !important;transition:none !important;}
}