/* BaraatPlan.pk — wedding stationery / invitation-card system.
   Maroon + gold palette, Cormorant Garamond display, Jost body, Red Hat Mono numerals.
   Layout language: centered split nav, ornamental dividers, a horizontal route-map timeline,
   alternating "spread" rows instead of card grids, and a stage-progress strip on article pages
   instead of a sidebar table of contents. */
:root{
  --ink:#3a1420;
  --ink-2:#6b4654;
  --bg:#fdf6ee;
  --surface:#ffffff;
  --line:#ecdfcf;
  --accent:#a8324a;
  --accent-2:#6b1f32;
  --gold:#b8860b;
  --gold-2:#8c6508;
  --blush:#e8c4ce;
  --ok-bg:#eef3e8;
  --ok:#5a7d3a;
  --radius:4px;
  --shadow:0 10px 30px -16px rgba(58,20,32,.28);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#f3e6ea; --ink-2:#cbb0b9; --bg:#1d0e13; --surface:#2a1620; --line:#45272f;
    --accent:#d9607a; --accent-2:#b8415c; --gold:#d9b23c; --gold-2:#c69a2e; --blush:#5a3540;
    --ok-bg:#1f2b17; --ok:#9bc26a;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ink:#f3e6ea; --ink-2:#cbb0b9; --bg:#1d0e13; --surface:#2a1620; --line:#45272f;
  --accent:#d9607a; --accent-2:#b8415c; --gold:#d9b23c; --gold-2:#c69a2e; --blush:#5a3540;
  --ok-bg:#1f2b17; --ok:#9bc26a;
  color-scheme:dark;
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--bg);color:var(--ink);font-family:"Jost", -apple-system, sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px;}
a{color:var(--accent-2);}
h1,h2,h3,h4{font-family:"Cormorant Garamond", Georgia, serif;color:var(--ink);line-height:1.15;text-wrap:balance;margin:0 0 .5em;font-weight:600;}
h1{font-size:clamp(2.4rem,5vw,3.6rem);}
h2{font-size:clamp(1.6rem,3vw,2.3rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1em;}
.nums{font-family:"Red Hat Mono", monospace;}
img{max-width:100%;}
[hidden]{display:none!important;}
.eyebrow{font-family:"Red Hat Mono", monospace;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:var(--gold-2);margin:0 0 .5em;}

/* ---- ornamental divider: a thin gold rule with a center diamond, used between major sections ---- */
.ornament-rule{display:flex;align-items:center;gap:14px;margin:0 auto;max-width:280px;}
.ornament-rule::before,.ornament-rule::after{content:"";flex:1;height:1px;background:var(--line);}
.ornament-rule .diamond{width:7px;height:7px;background:var(--gold);transform:rotate(45deg);flex-shrink:0;}

/* ---- paisley brand mark ---- */
.paisley-mark{width:26px;height:26px;color:var(--gold);flex-shrink:0;}

/* ---- header: centered logo flanked by a split nav ---- */
.site-header{border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:env(safe-area-inset-top,0px);z-index:40;}
.header-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:16px 20px;}
.brand{display:flex;align-items:center;gap:9px;font-family:"Cormorant Garamond",serif;font-weight:700;font-size:1.3rem;color:var(--ink);text-decoration:none;justify-content:center;white-space:nowrap;}
.split-nav{display:flex;list-style:none;margin:0;padding:0;gap:22px;}
.split-nav.nav-left{justify-content:flex-end;}
.split-nav.nav-right{justify-content:flex-start;}
.split-nav a{color:var(--ink-2);text-decoration:none;font-weight:500;font-size:.88rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;}
.split-nav a[aria-current="page"], .split-nav a:hover{color:var(--accent-2);}
.nav-toggle{display:none;background:var(--surface);border:1px solid var(--line);border-radius:2px;padding:8px 14px;font-weight:600;color:var(--ink);}
.mobile-nav{display:none;border-bottom:1px solid var(--line);background:var(--surface);}
.mobile-nav ul{list-style:none;margin:0;padding:10px 20px 16px;display:flex;flex-direction:column;gap:12px;}
.mobile-nav a{color:var(--ink);text-decoration:none;font-weight:600;}
@media (max-width:860px){
  .split-nav{display:none;}
  .header-inner{grid-template-columns:1fr auto;}
  .nav-toggle{display:inline-block;}
  .mobile-nav:not([hidden]){display:block;}
}

/* ---- hero: asymmetric invitation spread ---- */
.hero-spread{display:grid;grid-template-columns:1fr 1.3fr;gap:48px;align-items:center;padding:56px 0 40px;}
@media (max-width:860px){.hero-spread{grid-template-columns:1fr;padding:40px 0 24px;}}
.hero-motif{display:flex;align-items:center;justify-content:center;}
.hero-motif svg{width:100%;max-width:220px;height:auto;color:var(--gold);}
.hero-spread h1{max-width:18ch;}
.hero-lede{max-width:52ch;color:var(--ink-2);font-size:1.05rem;}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:2px;font-weight:600;text-decoration:none;font-size:.88rem;border:1px solid transparent;text-transform:uppercase;letter-spacing:.06em;}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent-2);}
.btn-ghost{background:transparent;border-color:var(--accent);color:var(--accent-2);}
.btn-ghost:hover{background:var(--blush);}
.hero-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;}

/* ---- route-map timeline (home + hub): horizontal path of numbered stage markers ---- */
.route-map{margin:36px 0;}
.route-track{display:grid;grid-template-columns:repeat(var(--stages,8),1fr);gap:0;position:relative;}
.route-track::before{content:"";position:absolute;left:0;right:0;top:19px;height:2px;background:var(--line);z-index:0;}
.route-stop{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 6px;text-decoration:none;}
.route-dot{width:40px;height:40px;border-radius:50%;background:var(--surface);border:2px solid var(--gold);color:var(--gold-2);display:flex;align-items:center;justify-content:center;font-family:"Red Hat Mono",monospace;font-weight:700;font-size:.82rem;margin-bottom:10px;}
.route-stop.is-current .route-dot{background:var(--accent);border-color:var(--accent);color:#fff;}
.route-stop-label{font-size:.76rem;color:var(--ink-2);font-weight:600;line-height:1.3;}
.route-stop:hover .route-stop-label{color:var(--accent-2);}
@media (max-width:760px){
  .route-track{grid-template-columns:1fr;gap:18px;}
  .route-track::before{left:19px;right:auto;top:0;bottom:0;width:2px;height:auto;}
  .route-stop{flex-direction:row;text-align:left;gap:14px;padding:0;}
  .route-dot{margin-bottom:0;flex-shrink:0;}
}

/* phase preview cards shown under the route map on the homepage */
.phase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:30px;border:1px solid var(--line);}
@media (max-width:860px){.phase-grid{grid-template-columns:1fr;}}
.phase-cell{padding:26px 28px;border-right:1px solid var(--line);}
.phase-grid .phase-cell:last-child{border-right:none;}
@media (max-width:860px){.phase-cell{border-right:none;border-bottom:1px solid var(--line);}
  .phase-grid .phase-cell:last-child{border-bottom:none;}}
.phase-cell .phase-tag{font-family:"Red Hat Mono",monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gold-2);}
.phase-cell h3{margin:.4em 0 .5em;font-size:1.15rem;}
.phase-cell h3 a{color:var(--ink);text-decoration:none;}
.phase-preview{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:7px;}
.phase-preview li{display:flex;align-items:baseline;gap:8px;color:var(--ink-2);font-size:.88rem;}
.phase-preview li::before{content:"\2726";color:var(--gold);font-size:.7rem;flex-shrink:0;}
.phase-more{margin-top:14px;font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;}

/* ---- ledger / spread rows: alternating image-or-motif + text, used in place of card grids ---- */
.spread-list{display:flex;flex-direction:column;}
.spread-row{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);}
.spread-row:first-child{padding-top:0;}
.spread-row:nth-child(even){grid-template-columns:1fr 200px;}
.spread-row:nth-child(even) .spread-figure{order:2;}
@media (max-width:700px){
  .spread-row,.spread-row:nth-child(even){grid-template-columns:1fr;gap:16px;}
  .spread-row:nth-child(even) .spread-figure{order:0;}
}
.spread-figure{display:flex;align-items:center;justify-content:center;}
.spread-figure svg{width:100%;max-width:120px;height:auto;color:var(--gold);}
.spread-figure img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line);}
.spread-body .eyebrow{margin-bottom:.3em;}
.spread-body h3{margin:0 0 .35em;font-size:1.3rem;}
.spread-body h3 a{color:var(--ink);text-decoration:none;}
.spread-body h3 a:hover{color:var(--accent-2);}
.spread-body p{color:var(--ink-2);margin:0 0 .6em;}
.spread-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.78rem;color:var(--gold-2);font-family:"Red Hat Mono",monospace;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.5em;}

/* ---- filter chips (reused generic pattern) ---- */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px;}
.chip{font-family:"Red Hat Mono",monospace;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);padding:7px 14px;border-radius:999px;cursor:pointer;}
.chip[aria-pressed="true"]{border-color:var(--accent);color:var(--accent-2);background:var(--blush);}
[data-tags][hidden]{display:none!important;}

/* ---- checklist ---- */
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.check-item{display:flex;align-items:flex-start;gap:12px;background:var(--surface);border:1px solid var(--line);padding:13px 15px;}
.check-item input[type="checkbox"]{width:20px;height:20px;margin-top:2px;accent-color:var(--accent);flex-shrink:0;}
.check-item label{flex:1;cursor:pointer;}
.check-item.checked label{color:var(--ink-2);text-decoration:line-through;}
.checklist-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:28px 0 14px;flex-wrap:wrap;}
.checklist-head .nums{color:var(--ink-2);font-size:.86rem;}

/* ---- budget snapshot bar ---- */
.budget-snapshot{background:var(--surface);border:1px solid var(--line);padding:24px;}
.snap-track{display:flex;height:20px;overflow:hidden;margin:10px 0 18px;border:1px solid var(--line);}
.snap-seg{height:100%;}
.snap-legend{display:grid;gap:9px;}
.snap-item{display:flex;align-items:center;justify-content:space-between;font-size:.88rem;}
.snap-item .label{display:flex;align-items:center;gap:8px;font-weight:600;}
.snap-item .dot{width:9px;height:9px;}
.snap-item .pct{font-family:"Red Hat Mono",monospace;color:var(--ink-2);}

/* ---- prose / articles ---- */
.prose{max-width:66ch;}
.prose h2{margin-top:1.6em;}
.prose table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.92rem;}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 10px;text-align:left;}
.prose th{font-family:"Red Hat Mono",monospace;text-transform:uppercase;font-size:.68rem;letter-spacing:.06em;color:var(--ink-2);}
.prose td.amount{font-family:"Red Hat Mono",monospace;}
.overflow-x{overflow-x:auto;}

.callout{border-left:3px solid var(--gold);background:color-mix(in srgb, var(--gold) 9%, var(--surface));padding:16px 22px;margin:1.5em 0;}
.callout .eyebrow{color:var(--gold-2);}
.tip-box{border:1px solid var(--line);background:var(--ok-bg);padding:16px 22px;margin:1.5em 0;}
.tip-box .eyebrow{color:var(--ok);}
blockquote.pull{font-family:"Cormorant Garamond",serif;font-size:1.5rem;font-style:italic;color:var(--accent-2);border:none;margin:1.6em 0;padding:0 0 0 24px;border-left:2px solid var(--gold);line-height:1.4;}

.faq-item{border-top:1px solid var(--line);padding:18px 0;}
.faq-item h4{margin:0 0 6px;font-size:1.1rem;font-family:"Cormorant Garamond",serif;}
.faq-item p{margin:0;color:var(--ink-2);}

.feedback-box{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);padding:18px 22px;margin-top:2em;}
.byline{display:flex;align-items:center;gap:10px;font-size:.9rem;color:var(--ink-2);}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-family:"Red Hat Mono",monospace;font-weight:700;font-size:.78rem;}
.article-meta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:16px;}
.breadcrumb{color:var(--ink-2);font-size:.84rem;margin:18px 0;}
.breadcrumb a{color:var(--ink-2);text-decoration:none;}
.breadcrumb a:hover{color:var(--accent-2);}

/* ---- stage progress strip: replaces a sidebar table of contents on timeline articles ---- */
.stage-strip{display:flex;align-items:center;gap:0;margin:22px 0 10px;overflow-x:auto;padding-bottom:4px;}
.stage-strip-item{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.stage-strip-dot{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);color:var(--ink-2);display:flex;align-items:center;justify-content:center;font-family:"Red Hat Mono",monospace;font-size:.7rem;font-weight:700;flex-shrink:0;text-decoration:none;}
.stage-strip-item.is-current .stage-strip-dot{border-color:var(--accent);background:var(--accent);color:#fff;}
.stage-strip-item.is-done .stage-strip-dot{border-color:var(--gold);color:var(--gold-2);}
.stage-strip-label{font-size:.76rem;color:var(--ink-2);white-space:nowrap;text-decoration:none;}
.stage-strip-item.is-current .stage-strip-label{color:var(--accent-2);font-weight:600;}
.stage-strip-sep{width:22px;height:1px;background:var(--line);flex-shrink:0;}

/* ---- jump bar: used on non-sequential guides instead of a sidebar ToC ---- */
.jump-bar{display:flex;flex-wrap:wrap;gap:8px 18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin:22px 0 30px;font-size:.84rem;}
.jump-bar a{color:var(--ink-2);text-decoration:none;}
.jump-bar a:hover{color:var(--accent-2);}
.jump-bar .label{font-family:"Red Hat Mono",monospace;text-transform:uppercase;letter-spacing:.05em;font-size:.72rem;color:var(--gold-2);margin-right:4px;}

/* ---- budget breakdown table accent ---- */
.budget-table-note{font-size:.8rem;color:var(--ink-2);margin-top:14px;}

/* ---- glossary ---- */
.glossary-jump{display:flex;flex-wrap:wrap;gap:6px;margin:22px 0 32px;}
.glossary-jump a{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);font-family:"Red Hat Mono",monospace;font-size:.8rem;font-weight:700;text-decoration:none;color:var(--ink-2);}
.glossary-jump a:hover{border-color:var(--accent);color:var(--accent-2);}
.glossary-group{padding:24px 0;border-bottom:1px solid var(--line);}
.glossary-group:last-child{border-bottom:none;}
.glossary-letter{font-family:"Cormorant Garamond",serif;font-size:1.6rem;color:var(--gold-2);margin-bottom:12px;}
.gterm{margin-bottom:16px;}
.gterm dt{font-weight:700;color:var(--ink);}
.gterm dt .also{font-weight:400;color:var(--ink-2);font-size:.84rem;font-style:italic;}
.gterm dd{margin:4px 0 0;color:var(--ink-2);}

.block{padding:52px 0;border-bottom:1px solid var(--line);}
.block-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap;}
.block-head a{font-weight:600;text-decoration:none;color:var(--accent-2);font-size:.82rem;text-transform:uppercase;letter-spacing:.05em;}
.block-head-center{text-align:center;max-width:620px;margin:0 auto 30px;}

.about-teaser{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;}
@media (max-width:760px){.about-teaser{grid-template-columns:1fr;}}
.card{background:var(--surface);border:1px solid var(--line);padding:22px;}

.contact-form{display:grid;gap:14px;max-width:480px;}
.form-row label{display:block;font-weight:600;font-size:.86rem;margin-bottom:6px;}
.form-row input,.form-row textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:2px;background:var(--surface);color:var(--ink);font-family:inherit;font-size:.95rem;}
.form-row textarea{min-height:100px;resize:vertical;}

/* ---- footer ---- */
.site-footer{background:var(--surface);border-top:1px solid var(--line);padding:0 0 24px;margin-top:20px;}
.footer-ornament{padding:22px 0;display:flex;justify-content:center;border-bottom:1px solid var(--line);}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:26px;padding:34px 0 28px;}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
.footer-grid h4{font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--gold-2);margin-bottom:10px;font-family:"Red Hat Mono",monospace;}
.footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.footer-grid a{color:var(--ink);text-decoration:none;font-size:.9rem;}
.footer-grid a:hover{color:var(--accent-2);}
.footer-blurb{color:var(--ink-2);font-size:.88rem;margin-top:8px;}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:18px;font-size:.8rem;color:var(--ink-2);}

.legal-body{max-width:68ch;padding:44px 0 60px;}
.legal-body h2{margin-top:1.6em;}
.legal-body section{margin-bottom:1.6em;}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease;}
.reveal.is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}
