
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:#e5f1f0; color:#1c3835; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:16px;
  line-height:1.55; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
a { color:#1c3835; text-decoration:none; }

.modfield { max-width:1160px; margin:0 auto; padding:clamp(16px,3vw,34px);
  display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(10px,1.6vw,20px);
  grid-auto-rows:clamp(120px,15vw,170px);
  background:
    linear-gradient(rgba(28,56,53,0.09) 1px,transparent 1px) 0 0/100% calc((100% )/1),
    linear-gradient(90deg,rgba(28,56,53,0.09) 1px,transparent 1px) 0 0/16.66% 100%; }

.unit { position:relative; background:#ffffff; border:1px solid rgba(28,56,53,0.14);
  border-radius:24px; padding:clamp(16px,2vw,26px); overflow:hidden;
  display:flex; flex-direction:column; justify-content:center; }
.coord { position:absolute; top:8px; left:10px; font-family:'Courier New', Courier, monospace; font-size:10px;
  letter-spacing:0.1em; color:#6c8f8a; }
.coord.light { color:#e9f5f4; mix-blend-mode:difference; }

.u-6x1 { grid-column:span 6; grid-row:span 1; }
.u-6x1.u-foot, .u-6x1.u-nav { grid-row:span 1; }
.u-4x2 { grid-column:span 4; grid-row:span 2; }
.u-4x1 { grid-column:span 4; grid-row:span 1; }
.u-3x2 { grid-column:span 3; grid-row:span 2; }
.u-2x2 { grid-column:span 2; grid-row:span 2; }

/* nav */
.u-nav { flex-direction:row; align-items:center; justify-content:space-between;
  grid-row:span 1; }
.brand { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:800; font-size:19px; }
.u-nav nav a { margin-left:20px; color:#6c8f8a; font-size:14px; }
.u-nav nav a:hover { color:#14ad9c; }

/* hero */
.u-hero { background:#ffffff; }
.kick { font-family:'Courier New', Courier, monospace; text-transform:uppercase; letter-spacing:0.22em;
  font-size:11px; color:#14ad9c; margin-bottom:14px; }
.u-hero h1 { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:800; line-height:0.96;
  font-size:clamp(2rem,5vw,3.6rem); letter-spacing:-0.02em; }
.dek { color:#6c8f8a; margin:16px 0 20px; max-width:38ch; }
.btn { align-self:flex-start; background:#14ad9c; color:#ffffff; font-weight:700;
  padding:12px 22px; border-radius:24px; letter-spacing:0.06em; }
.btn:hover { opacity:0.9; }

/* accent block */
.u-accent { background:#14ad9c; color:#ffffff; }
.u-accent .coord { color:#ffffff; opacity:0.7; }
.u-accent .big { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:800; font-size:3rem; line-height:1; }
.u-accent .lbl { font-family:'Courier New', Courier, monospace; font-size:11px; text-transform:uppercase;
  letter-spacing:0.14em; margin-top:6px; }

/* image */
.u-img { padding:0; }
.u-img img { width:100%; height:100%; object-fit:cover; }

/* about */
.u-about h2, .head .mono { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:800; }
.u-about h2 { font-size:1.4rem; margin-bottom:10px; }
.u-about p { color:#6c8f8a; font-size:0.95rem; }
.head { background:#e5f1f0; }
.head .mono { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-size:1.5rem; line-height:1.05; }

/* service units */
.u-2x2 h3 { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:700; font-size:1.05rem; margin-bottom:8px; }
.u-2x2 p { color:#6c8f8a; font-size:0.9rem; }

/* quote */
.u-quote blockquote { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:700; font-size:clamp(1.1rem,2.4vw,1.6rem);
  line-height:1.2; }
.u-quote cite { font-style:normal; color:#6c8f8a; font-family:'Courier New', Courier, monospace; font-size:11px;
  letter-spacing:0.12em; text-transform:uppercase; margin-top:10px; }

/* contact */
.ct { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; width:100%; }
.u-contact h2 { font-family:Garamond, 'EB Garamond', 'Times New Roman', serif; font-weight:800; font-size:1.5rem; margin-bottom:6px; }
.u-contact p { color:#6c8f8a; }
.ctlines { display:flex; flex-direction:column; gap:8px; font-family:Garamond, 'EB Garamond', 'Times New Roman', serif;
  font-size:1.15rem; text-align:right; }
.ctlines a:hover { color:#14ad9c; }
.ctlines span { color:#6c8f8a; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.95rem; }

.u-foot { background:#1c3835; color:#e9f5f4; align-items:center; text-align:center;
  flex-direction:row; justify-content:center; font-family:'Courier New', Courier, monospace; font-size:12px;
  letter-spacing:0.14em; text-transform:uppercase; }

@media (max-width:860px){
  .modfield{ grid-template-columns:repeat(2,1fr); grid-auto-rows:minmax(120px,auto);
    background:none; }
  .u-6x1,.u-4x2,.u-4x1,.u-3x2,.u-2x2{ grid-column:span 2; grid-row:auto; }
  .u-nav{ }
  .ctlines{ text-align:left; }
}


.xq{box-sizing:border-box;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;color:#1c3835;padding:56px 24px;width:100%}
.xq *{box-sizing:border-box;margin:0}
.xq .xq-wrap{max-width:1060px;margin:0 auto}
.xq h2{font-family:Garamond, 'EB Garamond', 'Times New Roman', serif;font-size:1.7rem;line-height:1.2;margin-bottom:8px}
.xq .xq-kick{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#14ad9c;margin-bottom:10px;font-weight:700}

.xq-badges{padding:26px 24px;border-top:1px solid rgba(28,56,53,0.14);border-bottom:1px solid rgba(28,56,53,0.14);background:rgba(28,56,53,0.05)}
.xq-badge-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.xq-badgehead{font-family:Garamond, 'EB Garamond', 'Times New Roman', serif;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-right:8px}
.xq-badge{border:1.5px solid #14ad9c;color:#14ad9c;border-radius:999px;padding:7px 16px;font-size:.8rem;font-weight:700;letter-spacing:.04em}


.xq-faq-list{margin-top:18px;border-top:1px solid rgba(28,56,53,0.14)}
.xq-faq-item{border-bottom:1px solid rgba(28,56,53,0.14);padding:4px 0}
.xq-faq-item summary{cursor:pointer;padding:14px 4px;font-weight:700;font-family:Garamond, 'EB Garamond', 'Times New Roman', serif;list-style-position:inside}
.xq-faq-item summary::marker{color:#14ad9c}
.xq-faq-item p{padding:0 4px 16px;color:#6c8f8a;max-width:64ch}


/* =====================================================
   DESIGN DNA: arch-roman
   Whole-page visual system applied over the layout
   archetype. Appended last so it wins the cascade.
   ===================================================== */
html::before{content:'';position:fixed;inset:0;z-index:99980;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='100'%3E%3Cpath d='M17.5 0V100' stroke='%2314ad9c' stroke-width='1'/%3E%3C/svg%3E");opacity:.05;}
h1,h2,h3{font-family:Baskerville, 'Baskerville Old Face', Georgia, serif !important;letter-spacing:.02em !important;font-weight:600 !important}
img{border-radius:180px 180px 0 0 !important;filter:sepia(.12) contrast(1.03)}
a[class*="btn"],button,span[class*="btn"]{border-radius:999px 999px 999px 999px !important;border:1.5px solid #14ad9c !important;letter-spacing:.1em}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border-radius:120px 120px 0 0 !important;border:1px solid rgba(20,173,156,.4) !important;box-shadow:none !important}
h2::after{content:'\2726';display:block;color:#14ad9c;font-size:1rem;margin-top:.5rem}
