/*
Theme Name: Hermagon
Theme URI: https://hermagon.com
Author: Ali Tasdemir / ChatGPT
Description: Custom single-page WordPress theme converted from the Hermagon HTML landing page. Editable through Appearance > Customize and theme files.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: hermagon
*/

*{box-sizing:border-box;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Inter,Arial,sans-serif}
:root{
  --navy:#080D1A;--navy2:#0D1528;--navy3:#131E30;--navy4:#1A2640;
  --gold:#C9A435;--gold2:#E8C84A;--gold3:#A8841E;
  --silver:#C8CDD8;--white:#FFFFFF;--gray:#6B7589;--lg:#9AA3B5;
  --br:rgba(255,255,255,0.07);--brgold:rgba(201,164,53,0.28)
}
body{background:var(--navy);color:var(--white)}

/* ── NAV ── */
.nav{
  background:var(--navy);border-bottom:1px solid var(--br);
  padding:0 48px;display:flex;align-items:center;
  justify-content:space-between;height:60px;
  position:sticky;top:0;z-index:100
}
.nav-logo{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:22px;font-weight:400;letter-spacing:6px;color:var(--white);
  cursor:pointer;text-decoration:none
}
.nav-logo span{color:var(--gold)}
.nav-links{display:flex;gap:4px}
.nl{background:none;border:none;color:var(--lg);font-size:12px;
  padding:7px 14px;cursor:pointer;letter-spacing:.4px;transition:color .15s}
.nl:hover{color:var(--white)}
.nav-right{display:flex;gap:10px}
.btn-ghost{
  background:none;border:1px solid var(--brgold);color:var(--gold);
  font-size:11px;padding:9px 20px;cursor:pointer;letter-spacing:.5px;
  transition:background .15s;font-family:inherit
}
.btn-ghost:hover{background:rgba(201,164,53,.07)}
.btn-gold{
  background:var(--gold);border:none;color:var(--navy);
  font-size:11px;font-weight:500;padding:9px 20px;cursor:pointer;
  letter-spacing:.5px;font-family:inherit
}
.btn-gold:hover{opacity:.88}

/* ── HERO ── */
.hero{
  background:var(--navy);border-bottom:1px solid var(--br);
  padding:88px 48px 72px
}
.eyebrow{
  font-size:9px;letter-spacing:5px;color:var(--gold);
  margin-bottom:24px;font-weight:400
}
.hero-h1{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:44px;font-weight:400;line-height:1.2;color:var(--white);
  max-width:560px;margin-bottom:20px;letter-spacing:-.5px
}
.hero-h1 em{font-style:normal;color:var(--gold)}
.hero-sub{
  font-size:14px;color:var(--lg);max-width:510px;
  line-height:1.9;margin-bottom:38px
}
.hero-btns{display:flex;gap:14px;margin-bottom:56px;flex-wrap:wrap}
.hbtn-p{
  background:var(--gold);border:none;color:var(--navy);
  font-size:12px;font-weight:500;padding:14px 28px;cursor:pointer;
  letter-spacing:.5px;font-family:inherit
}
.hbtn-p:hover{opacity:.9}
.hbtn-s{
  background:none;border:1px solid rgba(255,255,255,.15);
  color:var(--silver);font-size:12px;padding:14px 28px;
  cursor:pointer;letter-spacing:.5px;font-family:inherit
}
.hbtn-s:hover{border-color:rgba(255,255,255,.35);color:var(--white)}
.divline{width:100%;height:1px;background:var(--br);margin-bottom:32px}
.stats{display:flex;gap:44px;flex-wrap:wrap;align-items:flex-start}
.stat-v{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:22px;font-weight:400;color:var(--gold);margin-bottom:4px
}
.stat-l{font-size:9px;letter-spacing:2px;color:var(--gray)}
.stat-div{width:1px;height:32px;background:var(--br);align-self:center}

/* ── SECTIONS ── */
.sec{padding:72px 48px}
.sec2{background:var(--navy2);padding:72px 48px}
.rule{width:40px;height:2px;background:var(--gold);margin:14px 0 36px}
.sec-h2{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:28px;font-weight:400;color:var(--white);
  line-height:1.3;margin-bottom:8px;letter-spacing:-.3px
}
.sec-sub{
  font-size:13px;color:var(--lg);max-width:500px;
  line-height:1.9;margin-bottom:38px
}

/* ── PROBLEM ── */
.prob-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));
  gap:1px;background:var(--br)
}
.prob{background:var(--navy);padding:28px 22px}
.pnum{font-size:9px;letter-spacing:2px;color:var(--gold);margin-bottom:14px}
.ptitle{font-size:13px;font-weight:500;color:var(--white);margin-bottom:8px;line-height:1.4}
.pbody{font-size:11.5px;color:var(--gray);line-height:1.75}

/* ── SOLUTION ── */
.sol-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
  gap:1px;background:var(--br)
}
.sol{
  background:var(--navy2);padding:24px 20px;
  border-left:3px solid transparent;transition:border-color .2s
}
.sol:hover{border-left-color:var(--gold)}
.sico{font-size:20px;color:var(--gold);margin-bottom:12px}
.stitle{font-size:12.5px;font-weight:500;color:var(--white);margin-bottom:6px}
.sdesc{font-size:11.5px;color:var(--gray);line-height:1.75}

/* ── WORKFLOW ── */
.wf-rail{display:flex;border:1px solid var(--br);overflow-x:auto}
.wfs{
  min-width:108px;padding:20px 16px;border-right:1px solid var(--br);
  cursor:pointer;transition:background .15s
}
.wfs:last-child{border-right:none}
.wfs:hover,.wfs.on{background:var(--navy3)}
.wfs.on .wfn{color:var(--gold)}
.wfs.on .wfl{color:var(--white)}
.wfn{font-size:9px;letter-spacing:2px;color:var(--gray);margin-bottom:8px}
.wfl{font-size:11px;color:var(--lg);line-height:1.5}
.wf-box{
  background:var(--navy3);border:1px solid var(--br);
  border-top:2px solid var(--gold);padding:24px 28px
}
.wfd-title{font-size:14px;font-weight:500;color:var(--white);margin-bottom:8px}
.wfd-rule{width:28px;height:1px;background:var(--gold);margin:10px 0}
.wfd-body{font-size:12px;color:var(--lg);line-height:1.9;max-width:600px}

/* ── PLATFORM PREVIEW ── */
.demo-shell{background:var(--navy3);border:1px solid var(--br)}
.demo-bar{display:flex;border-bottom:1px solid var(--br);overflow-x:auto}
.dtab{
  background:none;border:none;color:var(--gray);font-size:11px;
  padding:13px 20px;cursor:pointer;border-bottom:2px solid transparent;
  white-space:nowrap;letter-spacing:.3px;font-family:inherit
}
.dtab.on{color:var(--gold);border-bottom-color:var(--gold)}
.dp{padding:24px}
.dp-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.dp-title{font-size:13px;font-weight:500;color:var(--white)}
.dp-sub{font-size:11px;color:var(--gray);margin-top:3px}
.krow{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--br);margin-bottom:18px}
.kbox{background:var(--navy2);padding:13px 15px}
.kv{font-size:18px;font-weight:400;color:var(--gold)}
.kl{font-size:9px;letter-spacing:1px;color:var(--gray);margin-top:3px}
.twin{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dcard{background:var(--navy2);border:1px solid var(--br);padding:16px}
.dcard-t{font-size:9px;letter-spacing:2px;color:var(--gray);margin-bottom:12px}
.drow{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--br);font-size:11px}
.drow:last-child{border-bottom:none}
.dlbl{color:var(--lg)}
.dval{color:var(--white);font-weight:500}
.txrow{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--br);font-size:11px}
.txrow:last-child{border-bottom:none}
.txname{font-weight:500;color:var(--white)}
.txid{font-size:10px;color:var(--gray);margin-top:2px}
.badge{font-size:9px;padding:2px 8px;letter-spacing:.4px}
.bok{background:rgba(46,125,82,.18);color:#4CAF7D}
.bpend{background:rgba(201,164,53,.14);color:var(--gold)}
.brev{background:rgba(58,130,213,.14);color:#5B9FE0}
.bnew{background:rgba(160,40,40,.18);color:#E05555}
.lrow{display:flex;justify-content:space-between;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--br);font-size:11px}
.lrow:last-child{border-bottom:none}
.lname{font-weight:500;color:var(--white);margin-bottom:3px}
.ldet{font-size:10px;color:var(--gray)}
.lval{font-size:13px;font-weight:400;color:var(--gold)}
.rfq-f{display:grid;gap:11px}
.rfq-lbl{font-size:9px;letter-spacing:2px;color:var(--gray);margin-bottom:4px}
.rfq-inp{background:var(--navy4);border:1px solid var(--br);color:var(--white);font-size:12px;padding:10px 13px;width:100%;font-family:inherit}
.rfq-inp::placeholder{color:var(--gray)}
.rfq-inp option{background:var(--navy3)}
.rfq-2{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.rfq-btn{background:var(--gold);border:none;color:var(--navy);font-size:11px;font-weight:500;padding:12px;cursor:pointer;letter-spacing:.5px;width:100%;font-family:inherit;margin-top:4px}
.doc-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--br);font-size:11px}
.doc-row:last-child{border-bottom:none}
.doc-ico{font-size:16px;color:var(--gold);flex-shrink:0}
.doc-name{color:var(--white);flex:1}
.doc-det{font-size:10px;color:var(--gray);margin-top:2px}
.ship-bar{display:flex;margin-bottom:16px}
.shs{flex:1;padding:8px 5px;text-align:center;background:var(--navy4);border-right:1px solid var(--br);font-size:9px;color:var(--gray);letter-spacing:.4px}
.shs:last-child{border-right:none}
.shs.done{background:rgba(46,125,82,.12);color:#4CAF7D}
.shs.now{background:rgba(201,164,53,.1);color:var(--gold)}
.tbar-w{height:4px;background:var(--navy4);margin:5px 0}
.tbar-f{height:4px;background:var(--gold)}

/* ── PHASE 1 ── */
.phase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--br)}
.pbox{background:var(--navy2);padding:30px 24px}
.pnum{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:28px;font-weight:400;color:var(--gold);margin-bottom:5px
}
.plbl{font-size:9px;letter-spacing:2px;color:var(--gray);margin-bottom:13px}
.pval{font-size:13px;font-weight:500;color:var(--white);margin-bottom:6px}
.pdesc{font-size:11.5px;color:var(--gray);line-height:1.8}

/* ── FOUNDER ── */
.founder-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--br)}
.fl{background:var(--navy2);padding:44px 36px}
.fr{background:var(--navy3);padding:44px 36px}
.fq{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:15.5px;font-weight:400;color:var(--silver);
  line-height:1.8;font-style:italic;margin-bottom:24px;letter-spacing:-.1px
}
.fn{font-size:12px;font-weight:500;color:var(--white);margin-bottom:2px}
.frole{font-size:9px;color:var(--gray);letter-spacing:.5px}
.f-rule{width:24px;height:2px;background:var(--gold);margin:20px 0}
.adv{display:flex;gap:12px;margin-bottom:18px;align-items:flex-start}
.adv-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);margin-top:6px;flex-shrink:0}
.adv-t{font-size:12px;color:var(--lg);line-height:1.8}
.adv-s{color:var(--white);font-weight:500}

/* ── CTA ── */
.cta{background:var(--navy2);border-top:1px solid var(--br);padding:72px 48px;text-align:center}
.cta-h{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:30px;font-weight:400;color:var(--white);
  margin-bottom:14px;letter-spacing:-.3px
}
.cta-sub{font-size:13px;color:var(--lg);margin-bottom:36px;line-height:1.9}
.cta-btns{display:flex;gap:14px;justify-content:center;margin-bottom:28px;flex-wrap:wrap}
.cta-note{font-size:9px;color:var(--gray);letter-spacing:.5px}

/* ── MODAL ── */
.modal-ov{
  display:none;position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(8,13,26,.9);z-index:200;
  align-items:center;justify-content:center
}
.modal-ov.open{display:flex}
.modal-box{
  background:var(--navy2);border:1px solid var(--brgold);
  width:450px;max-width:95vw;max-height:90vh;overflow-y:auto
}
.modal-hdr{
  background:var(--navy3);border-bottom:1px solid var(--br);
  padding:18px 24px;display:flex;justify-content:space-between;
  align-items:center;position:sticky;top:0
}
.modal-hdr-t{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:14px;font-weight:400;color:var(--white);letter-spacing:.5px
}
.modal-close{background:none;border:none;color:var(--gray);font-size:16px;cursor:pointer}
.modal-body{padding:24px}
.ftabs{display:flex;border:1px solid var(--br);margin-bottom:22px}
.ftab{flex:1;background:none;border:none;color:var(--gray);font-size:10px;padding:10px;cursor:pointer;letter-spacing:.5px;font-family:inherit}
.ftab.on{background:var(--gold);color:var(--navy);font-weight:500}
.fg{margin-bottom:14px}
.fg label{display:block;font-size:9px;letter-spacing:2px;color:var(--gray);margin-bottom:6px}
.fg input,.fg select{
  background:var(--navy3);border:1px solid var(--br);
  color:var(--white);font-size:12px;padding:11px 13px;
  width:100%;font-family:inherit
}
.fg input::placeholder{color:var(--gray)}
.fg select option{background:var(--navy3)}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.role-opt{border:1px solid var(--br);padding:14px;cursor:pointer;text-align:center;transition:border-color .15s}
.role-opt.on{border-color:var(--gold)}
.role-opt i{font-size:18px;color:var(--gold);display:block;margin-bottom:6px}
.role-opt span{font-size:9px;color:var(--lg);letter-spacing:.5px}
.fsubmit{
  background:var(--gold);border:none;color:var(--navy);
  font-size:11px;font-weight:500;padding:13px;cursor:pointer;
  width:100%;letter-spacing:.5px;font-family:inherit
}
.fnote{font-size:10px;color:var(--gray);text-align:center;margin-top:12px;line-height:1.7}
.fsuccess{padding:36px 24px;text-align:center}
.fsuccess i{font-size:28px;color:var(--gold);display:block;margin-bottom:12px}
.fsuccess-h{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:16px;font-weight:400;color:var(--white);margin-bottom:8px
}
.fsuccess-b{font-size:12px;color:var(--gray);line-height:1.7}

/* ── FOOTER ── */
.footer{background:var(--navy);border-top:1px solid var(--br);padding:44px 48px 26px}
.footer-grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:32px;margin-bottom:32px}
.fbrand{
  font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  font-size:18px;font-weight:400;letter-spacing:5px;color:var(--white);margin-bottom:4px
}
.fbrand-tag{font-size:8px;letter-spacing:3px;color:var(--gold);margin-bottom:10px;font-style:italic}
.fdesc{font-size:11px;color:var(--gray);line-height:1.75;max-width:210px}
.fch{font-size:8px;letter-spacing:2px;color:var(--gold);margin-bottom:12px}
.flnk{display:block;font-size:11px;color:var(--gray);padding:3px 0;cursor:pointer}
.flnk:hover{color:var(--white)}
.fbot{border-top:1px solid var(--br);padding-top:18px;display:flex;justify-content:space-between;align-items:center}
.fcopy{font-size:9.5px;color:var(--gray)}
.fbadges{display:flex;gap:8px}
.fbadge{font-size:8px;border:1px solid var(--brgold);color:var(--gold);padding:3px 8px;letter-spacing:1px}

/* WordPress admin bar + responsive helpers */
.admin-bar .nav{top:32px}
@media(max-width:782px){.admin-bar .nav{top:46px}}
@media(max-width:900px){
  .nav{height:auto;min-height:60px;padding:14px 18px;gap:12px;flex-wrap:wrap;position:relative}
  .nav-links{order:3;width:100%;overflow-x:auto;padding-top:6px}.nav-right{width:100%;flex-wrap:wrap}.btn-ghost,.btn-gold{flex:1;min-width:160px}
  .hero,.sec,.sec2,.cta,.footer{padding-left:22px;padding-right:22px}.hero{padding-top:54px}
  .hero-h1{font-size:34px}.stats{gap:22px}.stat-div{display:none}.phase-grid,.founder-grid,.footer-grid,.twin{grid-template-columns:1fr}.krow{grid-template-columns:1fr 1fr}.fg2,.rfq-2{grid-template-columns:1fr}
}
@media(max-width:520px){.hero-h1{font-size:29px}.sec-h2,.cta-h{font-size:25px}.krow{grid-template-columns:1fr}.nav-logo{font-size:18px;letter-spacing:4px}}
