:root{
  --paper: #F6F2E8;
  --paper-2: #EFEADC;
  --ink: #1C2B45;
  --ink-soft: #4A5872;
  --grid-line: rgba(28,43,69,0.09);
  --red: #C1442D;
  --red-dark: #9C3521;
  --gold: #C99A3D;
  --white: #FFFDF8;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter', sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.grid-bg{
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 32px 32px;
}
a{color:inherit;}
h1,h2,h3{font-family:'Fraunces', serif; margin:0; letter-spacing:-0.01em;}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  text-transform:uppercase;
  font-size:0.72rem;
  letter-spacing:0.14em;
  color:var(--red-dark);
  font-weight:500;
}
.wrap{max-width:920px; margin:0 auto; padding:0 28px;}

/* NAV */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(246,242,232,0.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--grid-line);
}
nav.wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:80px; max-width:1080px;
}
.brand{
  display:flex; align-items:center; gap:12px;
  font-family:'Fraunces', serif; font-weight:600; font-size:1.1rem;
  text-decoration:none; color:var(--ink);
}
.brand img{height:38px; width:auto; display:block;}
nav ul{ list-style:none; display:flex; gap:28px; margin:0; padding:0; }
nav ul a{
  text-decoration:none; font-size:0.94rem; font-weight:500; color:var(--ink-soft);
  padding-bottom:4px; border-bottom:2px solid transparent;
  transition:color .15s, border-color .15s;
}
nav ul a:hover, nav ul a:focus-visible{ color:var(--ink); border-color:var(--red); }
nav ul a.active{ color:var(--ink); border-color:var(--red); }
.nav-call{
  display:flex; align-items:center; gap:8px;
  background:var(--ink); color:var(--white)!important;
  padding:9px 18px; border-radius:30px; font-size:0.9rem; font-weight:600;
  text-decoration:none; white-space:nowrap;
  transition:background .15s;
}
.nav-call:hover{background:var(--red-dark);}
.nav-links{display:flex; align-items:center; gap:32px;}
.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.menu-toggle span{display:block; width:22px; height:2px; background:var(--ink); margin:5px 0;}

/* PAGE HEADER */
.page-header{ padding:60px 0 48px; border-bottom:1px solid var(--grid-line); }
.page-header h1{ font-size:clamp(1.9rem, 3.4vw, 2.6rem); font-weight:600; margin:12px 0 0; }
.breadcrumb{
  font-family:'IBM Plex Mono', monospace; font-size:0.76rem; color:var(--ink-soft); margin-bottom:6px;
}
.breadcrumb a{text-decoration:none; border-bottom:1px solid transparent;}
.breadcrumb a:hover{border-color:var(--ink-soft);}

main{padding-bottom:20px;}
section{padding:64px 0;}
.prose{max-width:70ch;}
.prose p{color:var(--ink-soft); font-size:1.04rem; margin:0 0 18px;}
.prose h2{font-size:1.4rem; font-weight:600; margin:0 0 16px;}
.prose h3{font-size:1.15rem; font-weight:600; margin:34px 0 12px;}
.prose ul{margin:0 0 18px; padding-left:22px; color:var(--ink-soft);}
.prose li{margin-bottom:8px; font-size:1.02rem;}

/* HOME HERO */
.hero{padding:76px 0 64px;}
.hero .eyebrow{margin-bottom:14px;}
.hero h1{font-size:clamp(2rem, 4vw, 2.9rem); font-weight:600; line-height:1.12; margin-bottom:16px;}
.hero .tagline{
  font-family:'Fraunces', serif; font-style:italic; font-size:1.25rem; color:var(--red-dark);
  margin:0 0 30px;
}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-top:8px;}
.btn-primary{
  background:var(--red); color:var(--white); border:none;
  padding:15px 26px; border-radius:8px; font-size:0.98rem; font-weight:600;
  text-decoration:none; display:inline-flex; align-items:center; gap:10px;
  box-shadow:0 3px 0 var(--red-dark);
  transition:transform .12s;
}
.btn-primary:hover{transform:translateY(-2px);}
.btn-secondary{
  background:transparent; color:var(--ink); border:1.5px solid var(--ink);
  padding:14.5px 24px; border-radius:8px; font-size:0.98rem; font-weight:600;
  text-decoration:none;
}

/* Two-column feature list (home) */
.highlights{
  display:grid; grid-template-columns:1fr 1fr; gap:0;
  background:var(--white); border:1px solid var(--grid-line); border-radius:10px;
  overflow:hidden; margin:40px 0;
}
.highlights .col{padding:30px 32px;}
.highlights .col:first-child{border-right:1px solid var(--grid-line);}
.highlights ul{margin:0; padding:0; list-style:none;}
.highlights li{
  display:flex; gap:10px; padding:8px 0; color:var(--ink-soft); font-size:0.98rem;
}
.highlights li svg{flex-shrink:0; margin-top:3px;}

.cta-band{
  background:var(--white); border:1px solid var(--grid-line); border-radius:10px;
  padding:32px 36px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  margin-bottom:36px;
}
.cta-band h3{font-size:1.2rem; font-weight:600; margin:0 0 4px;}
.cta-band p{margin:0; color:var(--ink-soft); font-size:0.98rem;}

.badge-row{display:flex; align-items:center; gap:16px; margin-top:8px;}
.badge-row img{height:64px; width:auto;}
.badge-row .cap{font-size:0.85rem; color:var(--ink-soft);}

/* Testimonials (blockquote style, matches original) */
.testi-block{
  background:var(--white); border:1px solid var(--grid-line); border-radius:10px;
  padding:28px 30px; margin-bottom:20px; position:relative;
}
.testi-block svg.tick-big{position:absolute; top:22px; right:22px;}
.testi-block blockquote{
  font-family:'Fraunces', serif; font-style:italic; font-size:1.08rem; color:var(--ink);
  margin:0 0 14px; line-height:1.55; padding:0;
}
.testi-block cite{
  font-family:'IBM Plex Mono', monospace; font-size:0.8rem; color:var(--ink-soft); font-style:normal;
}

/* Pagination (Prev / Next, like the original Joomla article navigation) */
.pagination{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  border-top:1px solid var(--grid-line); margin-top:40px; padding-top:28px;
}
.pagination a{
  text-decoration:none; font-size:0.92rem; font-weight:500; color:var(--ink-soft);
  display:flex; align-items:center; gap:8px;
  transition:color .15s;
}
.pagination a:hover{color:var(--red-dark);}
.pagination .dir{font-family:'IBM Plex Mono', monospace; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--red-dark); display:block;}
.pagination .next{margin-left:auto; text-align:right;}

.imgAndHeader{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.sideImg{
    max-width:40%;
}

footer{padding:36px 0 50px; text-align:center; border-top:1px solid var(--grid-line);}
footer .wrap{display:flex; flex-direction:column; align-items:center; gap:10px; max-width:1080px;}
footer p{color:var(--ink-soft); font-size:0.85rem; margin:0;}
footer .foot-links{display:flex; gap:18px; font-size:0.85rem; flex-wrap:wrap; justify-content:center;}
footer .foot-links a{text-decoration:none; color:var(--ink-soft);}
footer .foot-links a:hover{color:var(--ink);}

@media(max-width:880px){
  .nav-links{
    position:fixed; top:80px; left:0; right:0; background:var(--paper);
    flex-direction:column; align-items:flex-start; gap:0; padding:8px 28px 20px;
    border-bottom:1px solid var(--grid-line);
    transform:translateY(-130%); transition:transform .25s ease; z-index:40;
  }
  .nav-links.open{transform:translateY(0);}
  nav ul{flex-direction:column; gap:0; width:100%;}
  nav ul a{display:block; padding:13px 0; border-bottom:1px solid var(--grid-line); width:100%;}
  .nav-call{margin-top:14px; align-self:flex-start;}
  .menu-toggle{display:block;}
  .highlights{grid-template-columns:1fr;}
  .highlights .col:first-child{border-right:none; border-bottom:1px solid var(--grid-line);}
  .cta-band{flex-direction:column; align-items:flex-start;}
  section{padding:44px 0;}
  .pagination{flex-direction:column; align-items:flex-start; gap:14px;}
  .pagination .next{margin-left:0; text-align:left;}
}