/*
Theme Name:  CruiseForge
Theme URI:   https://yoursite.com/cruiseforge
Description: Lightweight dark SaaS theme built for the CruiseForge AI Video Automation plugin. Includes a marketing landing page, pricing section, and a full-width app shell template.
Version:     1.0.0
Author:      Your Name
Author URI:  https://yoursite.com
License:     GPL v2 or later
Text Domain: cruiseforge-theme
Tags:        dark, one-page, saas, custom-background, custom-logo, featured-images, threaded-comments, translation-ready
*/

/* Reset & base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:#020617;color:#cbd5e1;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:#f59e0b;text-decoration:none;transition:color .15s ease}
a:hover{color:#fbbf24}
ul,ol{padding-left:1.4em}
h1,h2,h3,h4,h5,h6{color:#f1f5f9;line-height:1.25;font-weight:700}

/* ── Layout ── */
.cf-container{max-width:1160px;margin:0 auto;padding:0 24px}
.cf-container--narrow{max-width:720px;margin:0 auto;padding:0 24px}
.cf-section{padding:80px 0}
.cf-section--sm{padding:48px 0}

/* ── Colours ── */
:root{
  --midnight:#020617;
  --navy:#0f172a;
  --slate:#1e293b;
  --border:#1e293b;
  --gold:#f59e0b;
  --gold-light:#fbbf24;
  --green:#22c55e;
  --muted:#64748b;
  --text:#cbd5e1;
  --heading:#f1f5f9;
}

/* ── Buttons ── */
.cf-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;border:none;transition:all .15s ease;text-decoration:none}
.cf-btn--primary{background:var(--gold);color:#000}
.cf-btn--primary:hover{background:var(--gold-light);color:#000;transform:translateY(-1px);box-shadow:0 8px 24px rgba(245,158,11,.3)}
.cf-btn--outline{background:transparent;color:var(--gold);border:1.5px solid var(--gold)}
.cf-btn--outline:hover{background:var(--gold);color:#000}
.cf-btn--dark{background:var(--slate);color:var(--text)}
.cf-btn--dark:hover{background:#273549;color:var(--heading)}
.cf-btn--lg{padding:16px 36px;font-size:17px;border-radius:12px}

/* ── Cards ── */
.cf-card{background:var(--navy);border:1px solid var(--border);border-radius:16px;padding:28px}

/* ── Badges ── */
.cf-badge{display:inline-block;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.cf-badge--gold{background:rgba(245,158,11,.15);color:var(--gold);border:1px solid rgba(245,158,11,.25)}
.cf-badge--green{background:rgba(34,197,94,.12);color:var(--green);border:1px solid rgba(34,197,94,.2)}

/* ── Form elements ── */
.cf-input{width:100%;padding:12px 16px;background:#1e293b;border:1px solid #334155;border-radius:8px;color:var(--heading);font-size:15px;outline:none;transition:border-color .15s}
.cf-input:focus{border-color:var(--gold)}
.cf-label{display:block;color:var(--text);font-size:13px;font-weight:600;margin-bottom:6px}

/* ── Utilities ── */
.cf-text-center{text-align:center}
.cf-text-muted{color:var(--muted)}
.cf-text-gold{color:var(--gold)}
.cf-text-green{color:var(--green)}
.cf-mt-4{margin-top:16px}
.cf-mt-8{margin-top:32px}
.cf-mb-4{margin-bottom:16px}
.cf-mb-8{margin-bottom:32px}
.cf-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.cf-grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.cf-flex{display:flex;align-items:center;gap:12px}
.cf-flex-between{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cf-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── Prose (blog / page content) ── */
.cf-prose{color:var(--text);line-height:1.75;max-width:68ch}
.cf-prose h1,.cf-prose h2,.cf-prose h3,.cf-prose h4{color:var(--heading);margin:1.5em 0 .6em}
.cf-prose p{margin-bottom:1.2em}
.cf-prose a{color:var(--gold)}
.cf-prose ul,.cf-prose ol{margin-bottom:1.2em}
.cf-prose li{margin-bottom:.4em}
.cf-prose code{background:#1e293b;padding:2px 6px;border-radius:4px;font-size:.9em;color:#f59e0b}
.cf-prose pre{background:#1e293b;padding:20px;border-radius:10px;overflow-x:auto;margin-bottom:1.2em}
.cf-prose blockquote{border-left:3px solid var(--gold);padding-left:16px;color:var(--muted);margin-bottom:1.2em}

/* ── Glow accents ── */
.cf-glow-gold{box-shadow:0 0 40px rgba(245,158,11,.15)}
.cf-glow-green{box-shadow:0 0 40px rgba(34,197,94,.1)}

/* ── Animations ── */
@keyframes cf-fade-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.cf-animate{animation:cf-fade-up .5s ease both}
.cf-animate-delay-1{animation-delay:.1s}
.cf-animate-delay-2{animation-delay:.2s}
.cf-animate-delay-3{animation-delay:.3s}

/* ── Divider ── */
.cf-divider{height:1px;background:var(--border);margin:0}

/* ── Responsive ── */
@media(max-width:768px){
  .cf-section{padding:56px 0}
  .cf-btn--lg{padding:14px 28px;font-size:16px}
  .cf-hide-mobile{display:none}
}

/* Component styles are in assets/css/components.css — enqueued via functions.php */