/* ===== Continental Creatives — Shared Styles ===== */
:root{
  --ink:#0B0B0C;
  --charcoal:#18181B;
  --white:#FFFFFF;
  --ivory:#F4EFE7;
  --gold:#C9A66B;
  --gold-soft:#E4D2AC;
  --line:rgba(255,255,255,0.14);
  --line-dark:rgba(11,11,12,0.12);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  font-family:'Inter',sans-serif;
  color:var(--white);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;letter-spacing:-0.01em;}
a{color:inherit;}
.wrap{max-width:900px;margin:0 auto;}
.eyebrow{
  font-family:'Inter',sans-serif;
  font-size:12px;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600;
}

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(11,11,12,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:1040px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 32px;
}
.nav-brand{
  display:flex;align-items:center;gap:12px;
  text-decoration:none;
}
.nav-brand img{height:34px;width:auto;}
.nav-brand span{
  font-family:'Fraunces',serif;
  font-size:15px;
  letter-spacing:0.05em;
  color:var(--white);
}
.nav-links{
  display:flex;align-items:center;gap:34px;
  list-style:none;
}
.nav-links a{
  text-decoration:none;
  font-size:13px;
  letter-spacing:0.04em;
  color:rgba(255,255,255,0.7);
  transition:color 0.2s ease;
}
.nav-links a:hover, .nav-links a.active{color:var(--gold-soft);}
.nav-cta{
  padding:10px 22px;
  border:1px solid var(--gold);
  color:var(--gold) !important;
  text-decoration:none;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:600;
  border-radius:2px;
  transition:all 0.2s ease;
}
.nav-cta:hover{background:var(--gold);color:var(--ink) !important;}
.nav-toggle{display:none;}

@media (max-width:720px){
  .nav-links{
    position:fixed; inset:64px 0 0 0;
    background:var(--ink);
    flex-direction:column;
    align-items:flex-start;
    padding:32px;
    gap:24px;
    transform:translateY(-8px);
    opacity:0;
    pointer-events:none;
    transition:all 0.25s ease;
  }
  .nav-links.open{opacity:1;transform:translateY(0);pointer-events:auto;}
  .nav-toggle{
    display:block;
    background:none;border:none;color:var(--white);
    font-size:22px;cursor:pointer;
  }
  .nav-cta{margin-top:8px;}
}

/* ---------- HATCH / LASH MOTIF ---------- */
.hatch-row{display:flex;align-items:flex-end;gap:6px;}
.hatch-line{
  width:2px;
  background:var(--gold);
  border-radius:2px;
  transform-origin:bottom;
  transform:rotate(-18deg);
}
.divider{display:flex;justify-content:center;gap:5px;padding:44px 0;}
.divider .hatch-line{height:22px;background:var(--line);}
.divider.gold .hatch-line{background:var(--gold);}

/* ---------- PAGE HERO (interior pages) ---------- */
.page-hero{
  padding:80px 40px 60px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.page-hero::before{
  content:"";
  position:absolute;
  top:-160px; left:50%;
  width:760px; height:760px;
  transform:translateX(-50%);
  background:radial-gradient(circle, rgba(201,166,107,0.13) 0%, rgba(201,166,107,0) 68%);
  pointer-events:none;
}
.page-hero h1{
  font-size:44px;line-height:1.1;
  max-width:640px;margin:18px auto 20px;
  color:var(--white);
}
.page-hero p.sub{
  max-width:480px;margin:0 auto;
  font-size:16px;line-height:1.7;
  color:rgba(255,255,255,0.62);
  font-weight:300;
}
.page-hero h1 em{font-style:italic;color:var(--gold-soft);}

/* ---------- HOME HERO ---------- */
.hero{padding:96px 40px 80px;text-align:center;position:relative;overflow:hidden;}
.hero::before{
  content:"";
  position:absolute;top:-140px;left:50%;
  width:820px;height:820px;transform:translateX(-50%);
  background:radial-gradient(circle, rgba(201,166,107,0.14) 0%, rgba(201,166,107,0) 68%);
  pointer-events:none;
}
.logo-mark{width:120px;height:auto;margin:0 auto 30px;display:block;filter:drop-shadow(0 0 40px rgba(201,166,107,0.15));}
.hero .eyebrow{display:block;margin-bottom:22px;}
.hero h1{font-size:52px;line-height:1.08;max-width:680px;margin:0 auto 26px;color:var(--white);}
.hero h1 em{font-style:italic;color:var(--gold-soft);}
.hero p.sub{max-width:480px;margin:0 auto 34px;font-size:16px;line-height:1.7;color:rgba(255,255,255,0.62);font-weight:300;}

.btn{
  display:inline-block;padding:16px 40px;
  border:1px solid var(--gold);color:var(--gold);
  text-decoration:none;font-size:13px;letter-spacing:0.18em;
  text-transform:uppercase;font-weight:600;border-radius:2px;
  transition:all 0.25s ease;
}
.btn:hover{background:var(--gold);color:var(--ink);}
.btn-outline-light{border-color:rgba(255,255,255,0.4);color:var(--white);}
.btn-outline-light:hover{background:var(--white);color:var(--ink);}

/* ---------- IVORY SECTION ---------- */
.section-ivory{background:var(--ivory);color:var(--ink);padding:76px 40px;}
.section-ivory .inner{max-width:760px;margin:0 auto;}
.section-ivory .eyebrow{color:#9C7B3F;}
.section-ivory h2{font-size:36px;line-height:1.15;margin:18px 0 46px;max-width:560px;}

.pain-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);}
.pain-card{background:var(--ivory);padding:30px 28px;display:flex;gap:16px;align-items:flex-start;}
.pain-card .hatch-row{margin-top:5px;flex-shrink:0;}
.pain-card .hatch-line{background:#9C7B3F;}
.pain-card p{font-size:15px;line-height:1.55;font-weight:400;color:#2B2620;}

/* ---------- PROCESS / STEPS ---------- */
.process{padding:88px 40px 60px;}
.process .inner{max-width:760px;margin:0 auto;}
.process .head{text-align:center;margin-bottom:60px;}
.process h2{font-size:36px;color:var(--white);margin-top:16px;}
.step{display:grid;grid-template-columns:64px 1fr;gap:28px;padding:36px 0;border-top:1px solid var(--line);}
.step:last-child{border-bottom:1px solid var(--line);}
.step-num{display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.step-num .n{font-family:'Fraunces',serif;font-size:15px;color:rgba(255,255,255,0.35);font-weight:400;}
.step h3{font-size:23px;color:var(--white);margin-bottom:10px;font-weight:500;}
.step p{font-size:15px;line-height:1.65;color:rgba(255,255,255,0.58);font-weight:300;max-width:520px;}
.step ul{margin-top:14px;padding-left:0;list-style:none;}
.step ul li{
  font-size:14px;color:rgba(255,255,255,0.55);
  padding-left:18px;position:relative;margin-bottom:8px;
}
.step ul li::before{
  content:"";position:absolute;left:0;top:9px;
  width:6px;height:1px;background:var(--gold);
}

/* ---------- VALUE GRID ---------- */
.value{background:var(--ivory);color:var(--ink);padding:80px 40px;}
.value .inner{max-width:800px;margin:0 auto;text-align:center;}
.value .eyebrow{color:#9C7B3F;}
.value h2{font-size:32px;margin:16px auto 50px;max-width:460px;line-height:1.2;}
.value-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:38px 30px;}
.value-item{text-align:left;}
.value-item .hatch-row{margin-bottom:16px;}
.value-item .hatch-line{background:#9C7B3F;}
.value-item h4{font-family:'Fraunces',serif;font-size:19px;font-weight:500;margin-bottom:8px;}
.value-item p{font-size:14px;line-height:1.6;color:#4A4438;font-weight:400;}

/* ---------- CTA / FOOTER SECTION ---------- */
.cta{padding:100px 40px 70px;text-align:center;position:relative;}
.cta .mini-mark{width:56px;height:auto;margin:0 auto 32px;opacity:0.9;}
.cta h2{font-size:38px;color:var(--white);max-width:560px;margin:0 auto 30px;line-height:1.18;}
.cta h2 em{font-style:italic;color:var(--gold-soft);}

/* ---------- SITE FOOTER ---------- */
.site-footer{
  border-top:1px solid var(--line);
  padding:40px 40px 50px;
  text-align:center;
}
.site-footer .foot-word{
  font-family:'Fraunces',serif;font-size:15px;
  letter-spacing:0.06em;color:rgba(255,255,255,0.4);
  margin-bottom:10px;
}
.site-footer .foot-links{
  display:flex;justify-content:center;gap:22px;
  font-size:12px;color:rgba(255,255,255,0.4);
  margin-top:10px;
}
.site-footer .foot-links a{text-decoration:none;color:rgba(255,255,255,0.55);}
.site-footer .foot-links a:hover{color:var(--gold-soft);}

/* ---------- ABOUT PAGE ---------- */
.about-body{padding:20px 40px 90px;}
.about-body .inner{max-width:700px;margin:0 auto;}
.about-body p{
  font-size:16px;line-height:1.85;
  color:rgba(255,255,255,0.68);
  font-weight:300;margin-bottom:24px;
}
.about-body p:first-of-type::first-letter{
  font-family:'Fraunces',serif;
  font-size:56px;float:left;line-height:0.8;
  margin:8px 10px 0 0;color:var(--gold);
}
.who-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:24px;margin-top:50px;
}
.who-card{
  border:1px solid var(--line);
  padding:26px 22px;border-radius:2px;
}
.who-card h4{font-family:'Fraunces',serif;font-size:17px;margin-bottom:8px;font-weight:500;}
.who-card p{font-size:13px;color:rgba(255,255,255,0.5);margin:0;line-height:1.55;}

/* ---------- CONTACT PAGE ---------- */
.contact-wrap{padding:20px 40px 100px;}
.contact-grid{
  max-width:820px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1.2fr;gap:60px;
}
.contact-info h3{font-size:22px;color:var(--white);margin-bottom:14px;}
.contact-info p{font-size:14.5px;line-height:1.7;color:rgba(255,255,255,0.6);font-weight:300;margin-bottom:24px;}
.contact-detail{margin-bottom:20px;}
.contact-detail .label{
  font-size:11px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:6px;
}
.contact-detail a, .contact-detail span{
  font-size:15px;color:var(--white);text-decoration:none;
}
.contact-detail a:hover{color:var(--gold-soft);}

.form-group{margin-bottom:20px;}
.form-group label{
  display:block;font-size:12px;letter-spacing:0.08em;
  text-transform:uppercase;color:rgba(255,255,255,0.5);
  margin-bottom:8px;
}
.form-group input, .form-group textarea{
  width:100%;
  background:var(--charcoal);
  border:1px solid var(--line);
  color:var(--white);
  padding:13px 14px;
  font-family:'Inter',sans-serif;
  font-size:14px;
  border-radius:2px;
  outline:none;
  transition:border-color 0.2s ease;
}
.form-group input:focus, .form-group textarea:focus{border-color:var(--gold);}
.form-group textarea{resize:vertical;min-height:110px;}
.form-submit{
  width:100%;
  background:var(--gold);
  color:var(--ink);
  border:none;
  padding:15px;
  font-size:13px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:600;
  border-radius:2px;
  cursor:pointer;
  transition:background 0.2s ease;
}
.form-submit:hover{background:var(--gold-soft);}
.form-note{
  font-size:12.5px;color:rgba(255,255,255,0.4);
  margin-top:14px;line-height:1.6;
}

@media (max-width:720px){
  .hero h1{font-size:36px;}
  .page-hero h1{font-size:32px;}
  .section-ivory h2, .process h2{font-size:27px;}
  .pain-grid{grid-template-columns:1fr;}
  .value-grid{grid-template-columns:1fr;}
  .step{grid-template-columns:44px 1fr;gap:16px;}
  .cta h2{font-size:29px;}
  .who-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;gap:44px;}
}

@media (prefers-reduced-motion:no-preference){
  .hero .logo-mark,.hero .eyebrow,.hero h1,.hero p.sub,.hero .btn,
  .page-hero .eyebrow,.page-hero h1,.page-hero p.sub{
    animation:rise 0.8s ease both;
  }
  .hero .eyebrow,.page-hero .eyebrow{animation-delay:0.05s;}
  .hero h1,.page-hero h1{animation-delay:0.15s;}
  .hero p.sub,.page-hero p.sub{animation-delay:0.26s;}
  .hero .btn{animation-delay:0.36s;}
}
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
