/* ========================================================================== Executive Jets Services FZE — Theme (Phase 1) Aesthetic: cinematic, dark, private-aviation luxury. Deep navy + champagne. ========================================================================== */ :root{ --bg:#0a0f1c; --surface:#0f1729; --surface-2:#152238; --text:#eef2fb; --muted:#94a6c4; --border:rgba(255,255,255,.09); --accent:#c9a86b; --accent-2:#4a6cf7; --accent-ink:#0a0f1c; --header-bg:rgba(9,14,26,.82); --nav-link:#eef2fb; --hero-overlay:linear-gradient(102deg,rgba(6,11,22,.94) 8%,rgba(6,11,22,.66) 52%,rgba(6,11,22,.30) 100%); --hero-lead:rgba(234,240,251,.86); --input-bg:rgba(255,255,255,.035); --input-bg-focus:rgba(255,255,255,.06); --cta-bg:linear-gradient(120deg,#0f1729,#182a49); --footer-bg:#080d18; --font-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; --font-display:"Fraunces","Playfair Display",Georgia,serif; --header-h:86px; } /* Fraunces optical richness for the big type */ .display,h1,.h1,h2,.h2{font-optical-sizing:auto;font-weight:600;letter-spacing:-.015em} .display{font-weight:600} h3,.h3{font-family:var(--font-display);font-weight:600} .eyebrow{color:var(--accent)} /* champagne gradient text accent for hero keyword */ .gold-underline{position:relative;white-space:nowrap} .gold-underline::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.10em;border-radius:2px; background:linear-gradient(90deg,var(--accent),transparent)} .text-gradient{background:linear-gradient(100deg,#e7cf9c,#c9a86b 55%,#a07d3e);-webkit-background-clip:text;background-clip:text;color:transparent} /* ambient background flourish */ body{background: radial-gradient(1200px 600px at 82% -8%,rgba(74,108,247,.10),transparent 60%), radial-gradient(900px 500px at -8% 22%,rgba(201,168,107,.08),transparent 60%), var(--bg)} /* section surfaces */ .section--panel{background:linear-gradient(180deg,var(--surface),transparent)} .bg-surface{background:var(--surface)} .hairline-top{border-top:1px solid var(--border)} /* aircraft spec table */ .spec{display:grid;grid-template-columns:1fr auto;gap:0;border-top:1px solid var(--border)} .spec div{display:contents} .spec dt,.spec dd{padding:14px 2px;border-bottom:1px solid var(--border);margin:0} .spec dt{color:var(--muted);font-size:.94rem} .spec dd{text-align:right;font-weight:600;font-family:var(--font-display)} /* gold rule */ .rule-gold{width:60px;height:2px;background:linear-gradient(90deg,var(--accent),transparent);border:0;margin:20px 0} /* fleet card price row */ .fleet-meta{display:flex;flex-wrap:wrap;gap:18px;color:var(--muted);font-size:.88rem;margin-top:6px} .fleet-meta b{color:var(--text);font-family:var(--font-display)} /* quote / testimonial */ .quote{font-family:var(--font-display);font-weight:500;font-size:clamp(1.4rem,2.6vw,2.1rem);line-height:1.35;letter-spacing:-.01em} .quote--em{font-style:italic} /* number-led steps */ .steps{counter-reset:s} .step{position:relative;padding-left:66px} .step::before{counter-increment:s;content:"0" counter(s);position:absolute;left:0;top:-4px; font-family:var(--font-display);font-weight:600;font-size:1.5rem;color:var(--accent)} .step h4{margin-bottom:6px} .step p{color:var(--muted);font-size:.95rem} /* pill on dark */ .pill{background:rgba(255,255,255,.04)} /* selection */ ::selection{background:var(--accent);color:var(--accent-ink)} /* ========================================================================== Light theme — "Daylight lounge": warm ivory, deep gold, navy ink. Activated via . Dark remains the brand default. ========================================================================== */ html[data-theme="light"]{ --bg:#f7f4ee; --surface:#fffdf8; --surface-2:#f0ebe0; --text:#161e31; --muted:#5d6a83; --border:rgba(22,30,49,.13); --accent:#9c7a37; --accent-2:#2b4cf0; --accent-ink:#ffffff; --header-bg:rgba(250,247,240,.9); --nav-link:#161e31; --input-bg:#f3efe6; --input-bg-focus:#fffdf8; --cta-bg:linear-gradient(120deg,#101729,#1d2d50); /* CTA stays a dark brand moment */ --shadow-sm:0 2px 12px rgba(22,30,49,.08); --shadow:0 22px 55px -22px rgba(22,30,49,.24); --shadow-lg:0 45px 90px -32px rgba(22,30,49,.3); } html[data-theme="light"] body{background: radial-gradient(1200px 600px at 82% -8%,rgba(43,76,240,.05),transparent 60%), radial-gradient(900px 500px at -8% 22%,rgba(156,122,55,.07),transparent 60%), var(--bg)} /* the footer stays dark in both modes — re-scope its palette locally */ html[data-theme="light"] .site-footer{--text:#eef2fb;--muted:#94a6c4;--border:rgba(255,255,255,.09); background:#0f1729;border-top-color:rgba(255,255,255,.09)} html[data-theme="light"] .text-gradient{background:linear-gradient(100deg,#8a6a2e,#9c7a37 55%,#6f5322); -webkit-background-clip:text;background-clip:text;color:transparent} html[data-theme="light"] .ticks li::before{background-color:rgba(156,122,55,.16); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c7a37' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")} html[data-theme="light"] .acc__q::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c7a37' stroke-width='2.5' stroke-linecap='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E")} html[data-theme="light"] .pill{background:#fffdf8} html[data-theme="light"] .hero__overlay{background:linear-gradient(102deg,rgba(6,11,22,.9) 8%,rgba(6,11,22,.6) 52%,rgba(6,11,22,.26) 100%)} /* theme toggle icons: dark default shows the sun (switch to light) */ .theme-toggle .i-moon{display:none} html[data-theme="light"] .theme-toggle .i-sun{display:none} html[data-theme="light"] .theme-toggle .i-moon{display:block}