/*
Theme Name:  Carotank Road
Theme URI:   https://carotankroad.com
Author:      Carotank Road Ventures
Author URI:  https://carotankroad.com
Description: Carotank Road — principal investment and advisory platform. Custom single-page WordPress theme. Version 7.
Version:     7.0
License:     Proprietary
Text Domain: carotankroad
*/

/* ── RESET & BASE ─────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

/* ── PALETTE ──────────────────────────────────────────────────────────────── */
:root{
  --xdnavy: #0a1220;
  --dnavy:  #0f1a2e;
  --navy:   #1a2744;
  --rule:   #2e3d5e;
  --cyan:   #28c3eb;
  --cxd:    rgba(40,195,235,0.06);
  --white:  #f5f4f0;
  --mgrey:  #8a9099;
}

/* ── BASE ─────────────────────────────────────────────────────────────────── */
body{
  background:var(--xdnavy);
  color:var(--white);
  font-family:'DM Sans',sans-serif;
  font-weight:300;
  overflow-x:hidden;
  line-height:1.7;
}

/* noise overlay */
body::before{
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:999;
  opacity:.6;
}

/* ── NAVIGATION ───────────────────────────────────────────────────────────── */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 64px;
  background:linear-gradient(to bottom,rgba(10,18,32,.97) 0%,transparent 100%);
  transition:padding .3s,background .3s;
}
.site-nav.scrolled{
  padding:16px 64px;
  background:rgba(10,18,32,.99);
  border-bottom:1px solid var(--rule);
}
.nav-logo{display:flex;align-items:center;gap:14px;text-decoration:none}
.nav-mark{height:38px;width:auto;opacity:.88}
.nav-wm{display:flex;flex-direction:column;gap:2px}
.nav-wm-top{
  font-family:'DM Sans',sans-serif;font-weight:600;
  font-size:11px;letter-spacing:.32em;color:var(--white);text-transform:uppercase;
}
.nav-wm-btm{
  font-family:'DM Sans',sans-serif;font-weight:400;
  font-size:9px;letter-spacing:.22em;color:var(--mgrey);text-transform:uppercase;
}
.nav-links{display:flex;align-items:center;gap:36px;list-style:none}
.nav-link{
  font-size:10px;font-weight:500;letter-spacing:.2em;
  color:var(--mgrey);text-decoration:none;text-transform:uppercase;
  transition:color .3s;
}
.nav-link:hover{color:var(--white)}
.nav-link--cta{
  font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--xdnavy);background:var(--cyan);
  padding:9px 20px;text-decoration:none;transition:opacity .2s;
}
.nav-link--cta:hover{opacity:.85}

/* hamburger — hidden on desktop */
.nav-toggle{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;z-index:201;padding:0;
}
.nav-toggle span{display:block;width:22px;height:1px;background:var(--white)}
.nav-close{
  display:none;background:none;border:none;
  color:var(--white);font-size:28px;cursor:pointer;
  align-self:flex-end;margin-bottom:32px;
}

/* ── HERO ─────────────────────────────────────────────────────────────────── */
.hero{
  min-height:100vh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:120px 64px 96px;
  position:relative;overflow:hidden;
  background:var(--xdnavy);
}
.hero-bg-mark{
  position:absolute;right:-5%;top:50%;transform:translateY(-50%);
  width:660px;height:auto;opacity:.07;
  pointer-events:none;filter:brightness(10);
}
.hero-wordmark{margin-bottom:20px;opacity:0;animation:fu .9s ease forwards .2s}
.hero-wm-main{
  font-family:'DM Sans',sans-serif;font-weight:600;
  font-size:clamp(26px,3.2vw,44px);letter-spacing:.3em;
  color:var(--white);text-transform:uppercase;
  display:block;line-height:1.1;
}
.hero-wm-sub{
  font-family:'DM Sans',sans-serif;font-weight:300;
  font-size:clamp(11px,1.3vw,17px);letter-spacing:.28em;
  color:var(--mgrey);text-transform:uppercase;
  display:block;margin-top:7px;
}
.hero-wm-dash{color:var(--cyan)}
.hero-rule{width:44px;height:1px;background:var(--cyan);margin:28px 0;opacity:0;animation:fu .9s ease forwards .35s}
.hero-headline{
  font-family:'Playfair Display',serif;font-weight:300;
  font-size:clamp(44px,6.2vw,84px);line-height:1.0;
  letter-spacing:-.02em;color:var(--white);
  max-width:820px;opacity:0;animation:fu .9s ease forwards .45s;
}
.hero-headline em{font-style:italic;color:var(--cyan)}
.hero-body{
  margin-top:32px;font-size:14px;font-weight:300;
  letter-spacing:.04em;color:var(--mgrey);
  max-width:560px;line-height:1.9;
  opacity:0;animation:fu .9s ease forwards .6s;
}
.hero-divider{width:44px;height:1px;background:var(--cyan);margin-top:44px;opacity:0;animation:fu .9s ease forwards .72s}
.hero-stats{margin-top:36px;display:flex;gap:56px;opacity:0;animation:fu .9s ease forwards .85s}
.stat-value{
  font-family:'Playfair Display',serif;
  font-size:clamp(26px,3vw,40px);font-weight:300;
  color:var(--white);line-height:1;letter-spacing:-.01em;
}
.stat-value em{color:var(--cyan);font-style:italic}
.stat-label{font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--mgrey);margin-top:6px}
.hero-scroll{
  position:absolute;bottom:36px;right:64px;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  z-index:2;opacity:0;animation:fu 1s ease forwards 1s;
}
.hero-scroll span{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--mgrey);writing-mode:vertical-rl}
.hero-scroll-line{width:1px;height:44px;background:linear-gradient(to bottom,var(--cyan),transparent);animation:sp 2.2s ease-in-out infinite}
@keyframes sp{0%,100%{opacity:.3}50%{opacity:1}}

/* ── SECTION COMMONS ──────────────────────────────────────────────────────── */
.section{padding:112px 64px;position:relative}
.section--dark{background:var(--dnavy)}
.section--deep{background:var(--xdnavy)}
.section--ruled{border-top:1px solid var(--rule)}

.section-label{
  font-size:10px;font-weight:500;letter-spacing:.35em;
  color:var(--cyan);text-transform:uppercase;
  margin-bottom:44px;display:flex;align-items:center;gap:14px;
}
.section-label::before{content:'';display:block;width:28px;height:1px;background:var(--cyan);flex-shrink:0}
.section-headline{
  font-family:'Playfair Display',serif;font-weight:300;
  font-size:clamp(30px,3.8vw,52px);line-height:1.05;
  letter-spacing:-.01em;color:var(--white);margin-bottom:24px;
}
.section-headline em{font-style:italic;color:var(--cyan)}
.text-lg{font-size:15px;font-weight:300;line-height:1.85;color:var(--white);letter-spacing:.03em;margin-bottom:18px}
.text-sm{font-size:13px;font-weight:300;line-height:1.9;color:var(--mgrey);letter-spacing:.04em;margin-bottom:16px}

/* ── WHAT WE DO ───────────────────────────────────────────────────────────── */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.steps{display:flex;flex-direction:column;border:1px solid var(--rule);margin-top:40px}
.step{padding:28px 32px;border-bottom:1px solid var(--rule);position:relative;transition:background .3s}
.step:last-child{border-bottom:none}
.step:hover{background:var(--cxd)}
.step::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:1px;
  background:var(--cyan);transform:scaleY(0);transform-origin:top;transition:transform .35s;
}
.step:hover::before{transform:scaleY(1)}
.step-number{font-size:9px;font-weight:600;letter-spacing:.25em;color:var(--cyan);margin-bottom:8px;text-transform:uppercase}
.step-title{font-size:12px;font-weight:500;letter-spacing:.1em;color:var(--white);margin-bottom:8px;text-transform:uppercase}
.step-body{font-size:12px;font-weight:300;color:var(--mgrey);line-height:1.85;letter-spacing:.03em}
.pullquote{border-left:1px solid var(--cyan);padding-left:28px;margin:36px 0}
.pullquote p{
  font-family:'Playfair Display',serif;font-size:clamp(17px,1.9vw,22px);
  font-weight:300;font-style:italic;line-height:1.55;color:var(--white);letter-spacing:.01em;
}

/* ── VENTURES ─────────────────────────────────────────────────────────────── */
.ventures{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:56px}
.venture-card{
  background:rgba(255,255,255,.03);border:1px solid var(--rule);
  padding:48px 40px;position:relative;transition:background .3s;
  text-decoration:none;display:block;color:inherit;
}
.venture-card:not(.venture-card--locked):hover{background:var(--cxd)}
.venture-card::before{
  content:'';position:absolute;top:0;left:0;bottom:0;width:1px;
  background:var(--cyan);transform:scaleY(0);transform-origin:top;transition:transform .4s;
}
.venture-card:not(.venture-card--locked):hover::before{transform:scaleY(1)}
.venture-sector{font-size:9px;font-weight:500;letter-spacing:.2em;color:var(--cyan);text-transform:uppercase;margin-bottom:20px}
.venture-name{
  font-family:'Playfair Display',serif;
  font-size:clamp(22px,2.4vw,32px);font-weight:300;
  color:var(--white);margin-bottom:6px;line-height:1.1;
}
.venture-name em{font-style:normal;color:var(--cyan)}
.venture-tagline{font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--mgrey);margin-bottom:24px}
.venture-desc{font-size:12px;font-weight:300;color:var(--mgrey);line-height:1.85;letter-spacing:.03em;margin-bottom:24px}
.venture-status-live{
  display:inline-block;font-size:9px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cyan);border:1px solid var(--rule);padding:5px 12px;
}
.venture-status-pipe{
  display:inline-block;font-size:9px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--mgrey);border:1px solid var(--rule);padding:5px 12px;opacity:.5;
}
.venture-link{margin-top:16px;font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);display:block}
.arrow{display:inline-block;margin-left:6px}

/* ── ENGAGEMENTS ──────────────────────────────────────────────────────────── */
.engagement-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:56px}
.engagement-panel{border:1px solid var(--rule);padding:48px 40px}
.engagement-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;border-bottom:1px solid var(--rule);
}
.engagement-row:last-child{border-bottom:none}
.engagement-name{font-size:14px;font-weight:300;color:var(--white);letter-spacing:.02em}
.engagement-sector{font-size:9px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--mgrey);margin-top:3px}
.engagement-dot{width:4px;height:4px;background:var(--cyan);border-radius:50%;flex-shrink:0}
.country-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--rule)}
.country-row:last-child{border-bottom:none}
.country-bar{width:1px;height:28px;background:var(--cyan);flex-shrink:0}
.country-name{font-size:13px;font-weight:300;color:var(--white);letter-spacing:.04em}

/* ── CONTACT ──────────────────────────────────────────────────────────────── */
.contact-split{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule)}
.contact-left{padding:96px 64px;border-right:1px solid var(--rule);background:var(--xdnavy)}
.contact-right{padding:96px 64px;background:var(--dnavy)}
.contact-headline{
  font-family:'Playfair Display',serif;font-weight:300;
  font-size:clamp(34px,4vw,56px);line-height:1.05;
  letter-spacing:-.01em;color:var(--white);margin-bottom:20px;
}
.contact-headline em{font-style:italic;color:var(--cyan)}
.contact-note{font-size:13px;font-weight:300;color:var(--mgrey);line-height:1.85;letter-spacing:.04em;max-width:340px;margin-bottom:16px}
.contact-links{margin-top:48px}
.contact-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 0;border-bottom:1px solid var(--rule);
  text-decoration:none;transition:padding-left .3s;
}
.contact-link:first-child{border-top:1px solid var(--rule)}
.contact-link:hover{padding-left:8px}
.contact-link-address{font-size:13px;font-weight:300;color:var(--white);letter-spacing:.02em}
.contact-link-type{font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--mgrey);margin-top:3px}
.contact-link-arrow{color:var(--cyan);font-size:15px}

/* contact form */
.contact-form{display:flex;flex-direction:column;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-field{display:flex;flex-direction:column;gap:6px}
.form-field label{font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mgrey)}
.form-field input,
.form-field textarea,
.form-field select{
  background:rgba(255,255,255,.04);border:1px solid var(--rule);
  padding:11px 13px;font-family:'DM Sans',sans-serif;
  font-size:13px;font-weight:300;color:var(--white);
  outline:none;-webkit-appearance:none;
  transition:border-color .2s,background .2s;
}
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus{border-color:var(--cyan);background:var(--cxd)}
.form-field input::placeholder,
.form-field textarea::placeholder{color:rgba(138,144,153,.45)}
.form-field select option{background:var(--navy);color:var(--white)}
.form-field textarea{resize:vertical;min-height:96px}
.form-note{font-size:11px;font-weight:300;color:var(--mgrey);line-height:1.7;letter-spacing:.03em}
.form-submit{
  font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--xdnavy);background:var(--cyan);border:none;
  padding:12px 24px;cursor:pointer;align-self:flex-start;transition:opacity .2s;
}
.form-submit:hover{opacity:.85}

/* ── FOOTER ───────────────────────────────────────────────────────────────── */
.site-footer{
  background:var(--xdnavy);border-top:1px solid var(--rule);
  padding:32px 64px;display:flex;align-items:center;justify-content:space-between;
}
.footer-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.footer-mark{height:28px;width:auto;opacity:.35}
.footer-wordmark{
  font-family:'DM Sans',sans-serif;font-weight:600;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(245,244,240,.3);
}
.footer-links{display:flex;gap:24px;list-style:none}
.footer-links a{
  font-size:10px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mgrey);text-decoration:none;transition:color .2s;
}
.footer-links a:hover{color:var(--white)}
.footer-copy{font-size:10px;letter-spacing:.06em;color:rgba(138,144,153,.35)}

/* ── SCROLL REVEAL ────────────────────────────────────────────────────────── */
@keyframes fu{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.reveal.delay-1{transition-delay:.1s}
.reveal.delay-2{transition-delay:.22s}
.reveal.delay-3{transition-delay:.34s}
.reveal.delay-4{transition-delay:.46s}

/* ── MOBILE ───────────────────────────────────────────────────────────────── */
@media(max-width:960px){
  .site-nav,.site-nav.scrolled{padding:18px 24px}
  .nav-toggle{display:flex}
  .nav-links{
    display:none;position:fixed;inset:0;
    background:var(--xdnavy);flex-direction:column;
    align-items:flex-start;padding:24px;z-index:200;gap:0;
    list-style:none;
  }
  .nav-links.is-open{display:flex}
  .nav-close{display:block}
  .nav-link{padding:16px 0;border-bottom:1px solid var(--rule);width:100%;font-size:13px;color:var(--white)}
  .nav-link--cta{margin-top:24px}
  .hero{padding:110px 24px 72px}
  .hero-scroll{right:24px}
  .hero-stats{flex-wrap:wrap;gap:28px}
  .section{padding:80px 24px}
  .two-col,.ventures,.engagement-grid,.contact-split{grid-template-columns:1fr}
  .contact-left{border-right:none;border-bottom:1px solid var(--rule);padding:64px 24px}
  .contact-right{padding:64px 24px}
  .form-row{grid-template-columns:1fr}
  .site-footer{flex-direction:column;gap:16px;text-align:center;padding:28px 24px}
  .footer-links{flex-wrap:wrap;justify-content:center;gap:16px}
}
@media(max-width:480px){
  .hero-headline{font-size:42px}
  .hero-stats{gap:20px}
}
