/* ============================================================
   SCULTOR v2 — brand system.
   Only thing carried over from v1: the green. Everything else rebuilt
   to read like a product company rather than a freelance catalog.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500..700;1,9..144,500..600&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --green:     #15794A;   /* carried over — the one constant */
  --green-dk:  #0E5B37;
  --green-soft:#E4F1E8;

  --paper:  #FCFAF6;
  --card:   #FFFFFF;
  --sand:   #F4F1E9;
  --line:   #E5E1D6;
  --line-2: #D6D0C0;
  --ink:    #232821;
  --ink2:   #5A6154;
  --ink3:   #8F9585;

  --coal:   #14140F;
  --coal-2: #1D1D16;
  --cream:  #F6F3EA;
  --cream-2:#B4B0A2;
  --gold:   #C9A26B;

  --sun:    #E0912B;
  --sun-soft:#FBF0DC;
  --terra:  #BE6A46;
  --terra-soft:#F8E8E0;
  --chip-sun-txt:  #8A5A12;
  --chip-terra-txt:#93482299;

  --r:    14px;
  --r-sm: 9px;
  --r-lg: 22px;
  --shadow:   0 1px 2px rgba(35,40,33,.05), 0 4px 16px rgba(35,40,33,.05);
  --shadow-h: 0 8px 30px rgba(35,40,33,.12);
  --nav-bg: rgba(252,250,246,.88);

  --font-d: 'Fraunces', Georgia, serif;
  --font-b: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-m: ui-monospace, 'Cascadia Mono', Menlo, Consolas, monospace;

  color-scheme: light;
}

html[data-theme="dark"] {
  --green:     #45A473;
  --green-dk:  #58BA88;
  --green-soft:rgba(69,164,115,.15);

  --paper:  #121310;
  --card:   #1B1D18;
  --sand:   #0D0E0B;
  --line:   #2E312A;
  --line-2: #3D4137;
  --ink:    #F4F2EA;
  --ink2:   #B9B6A8;
  --ink3:   #85897A;

  --coal:   #0A0B08;
  --coal-2: #121310;

  --sun:    #E9A84E;
  --sun-soft:rgba(224,145,43,.14);
  --terra:  #D08560;
  --terra-soft:rgba(190,106,70,.16);
  --chip-sun-txt:  #F0C481;
  --chip-terra-txt:#E4A487;

  --shadow:   0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.3);
  --shadow-h: 0 8px 30px rgba(0,0,0,.5);
  --nav-bg: rgba(14,15,12,.88);

  color-scheme: dark;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { background:var(--paper); color:var(--ink2); font-family:var(--font-b); font-size:15px; line-height:1.65; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
input, select, textarea { font-family:inherit; font-size:inherit; }
img, svg { vertical-align:middle; }
::selection { background:var(--green-soft); }

.wrap { max-width:1080px; margin:0 auto; padding:0 20px; }
.wrap.narrow { max-width:760px; }

h1,h2,h3,.display { font-family:var(--font-d); color:var(--ink); font-weight:600; line-height:1.14; }
h1 { font-size:clamp(36px,6.2vw,58px); letter-spacing:-1px; }
h2 { font-size:clamp(27px,4.4vw,38px); letter-spacing:-.5px; }
h3 { font-size:18px; letter-spacing:-.2px; }
.accent-i { font-style:italic; color:var(--green); }
.accent-g { font-family:var(--font-d); font-style:italic; font-weight:500; color:var(--gold); }
.eyebrow { display:inline-block; font-size:11px; font-weight:800; letter-spacing:2.4px;
           text-transform:uppercase; color:var(--green); margin-bottom:13px; }
.lede { font-size:16.5px; color:var(--ink2); max-width:620px; line-height:1.62; }
.sub  { font-size:13px; color:var(--ink3); }

/* ---------- nav ---------- */
.navbar { position:sticky; top:0; z-index:100; background:var(--nav-bg);
          backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
          border-bottom:1px solid var(--line); }
.navbar .in { display:flex; align-items:center; gap:10px; min-height:62px; flex-wrap:wrap; padding:6px 0; }
.brand { display:flex; align-items:center; gap:10px; margin-right:auto; }
.brand .mark { width:32px; height:32px; flex-shrink:0; }
.brand .name { font-family:var(--font-d); font-weight:600; font-size:21px; color:var(--ink); }
.navbar .links { display:flex; gap:2px; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.navbar .links a { padding:8px 12px; border-radius:999px; font-size:13px; font-weight:600;
                   color:var(--ink2); transition:all .15s; white-space:nowrap; }
.navbar .links a:hover { color:var(--green); background:var(--green-soft); }
.navbar .links a.cta { background:var(--green); color:#fff; padding:9px 17px; }
.navbar .links a.cta:hover { background:var(--green-dk); color:#fff; }
@media (max-width:760px){ .navbar .links a { padding:7px 9px; font-size:12px; } }
@media (max-width:560px){ .navbar .mob-hide { display:none; } }

.langbtn,.themebtn { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:800;
  color:var(--green); border:1.5px solid var(--line-2); border-radius:999px; padding:7px 13px; transition:all .15s; }
.langbtn:hover,.themebtn:hover { border-color:var(--green); }
.themebtn { padding:6px 9px; font-size:14px; line-height:1; }
.themebtn .sgs { width:17px; height:17px; display:block; }
.btn .ic { width:19px; height:19px; color:currentColor; }
.btn.ghost .ic { color:var(--green); }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px;
       background:var(--green); color:#fff; font-weight:700; font-size:14.5px;
       padding:13px 24px; border-radius:999px; box-shadow:var(--shadow); transition:all .15s; }
.btn:hover { background:var(--green-dk); transform:translateY(-1px); box-shadow:var(--shadow-h); }
.btn.ghost { background:var(--card); color:var(--ink); border:1.5px solid var(--line-2); box-shadow:none; }
.btn.ghost:hover { border-color:var(--green); color:var(--green); background:var(--card); }
.btn.big { padding:15px 28px; font-size:15.5px; }
.btn.sm { padding:9px 16px; font-size:13px; }
.btn.wide { display:flex; width:100%; }
.btn[disabled] { opacity:.5; pointer-events:none; }

/* ---------- chips ---------- */
.chip { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700;
        padding:5px 11px; border-radius:999px; background:var(--green-soft); color:var(--green-dk); }
.chip.sun   { background:var(--sun-soft);   color:var(--chip-sun-txt); }
.chip.terra { background:var(--terra-soft); color:var(--chip-terra-txt); }
.chip.line  { background:transparent; border:1px solid var(--line-2); color:var(--ink3); }
.ticks { display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13px; font-weight:600; color:var(--ink2); }
.ticks span::before { content:'\2713  '; color:var(--green); font-weight:800; }

/* ---------- layout ---------- */
.sec { padding:70px 0; }
.sec.alt { background:var(--sand); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.sec.dark { background:var(--coal); }
.sec.dark h2 { color:var(--cream); }
.sec.dark .lede { color:var(--cream-2); }
.sec.dark .eyebrow { color:var(--gold); }
.sec-head { margin-bottom:30px; }
.sec-head .lede { margin-top:11px; }

.card { background:var(--card); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); }
.grid2 { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
@media (max-width:900px){ .grid4 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:780px){ .grid2,.grid3 { grid-template-columns:1fr; } }
@media (max-width:520px){ .grid4 { grid-template-columns:1fr; } }

/* ---------- proof strip ---------- */
.proof { display:flex; flex-wrap:wrap; gap:10px 34px; align-items:center;
         border-top:1px solid var(--line); border-bottom:1px solid var(--line);
         padding:18px 0; margin-top:34px; }
.proof .n { font-family:var(--font-d); font-size:26px; font-weight:600; color:var(--ink); line-height:1; }
.proof .l { font-size:11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink3); margin-top:4px; }

/* ---------- pricing ---------- */
.tiers { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; align-items:stretch; }
@media (max-width:940px){ .tiers { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .tiers { grid-template-columns:1fr; } }
.tier { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
        padding:22px 20px; display:flex; flex-direction:column; gap:9px; position:relative;
        transition:transform .15s, box-shadow .15s, border-color .15s; }
.tier:hover { transform:translateY(-3px); box-shadow:var(--shadow-h); }
.tier.feat { border-color:var(--green); border-width:1.5px; }
.tier.feat::before { content:attr(data-badge); position:absolute; top:-10px; left:20px;
  background:var(--green); color:#fff; font-size:10px; font-weight:800; letter-spacing:1.2px;
  text-transform:uppercase; padding:4px 10px; border-radius:999px; }
.tier h3 { font-size:20px; }
.tier .tag { font-size:13px; color:var(--ink2); min-height:38px; }
.tier .price { font-family:var(--font-d); font-size:30px; font-weight:600; color:var(--ink); line-height:1.1; margin-top:4px; }
.tier .price small { display:block; font-family:var(--font-b); font-size:11px; font-weight:700;
  letter-spacing:1.3px; text-transform:uppercase; color:var(--ink3); margin-bottom:3px; }
.tier .care { font-size:11px; color:var(--ink3); border-top:1px solid var(--line); padding-top:8px; margin-top:3px; letter-spacing:.2px; }
.tier ul { list-style:none; display:flex; flex-direction:column; gap:6px; font-size:13px; flex:1; margin-top:4px; }
.tier ul li { display:flex; gap:7px; align-items:flex-start; }
.tier ul li::before { content:'\2713'; color:var(--green); font-weight:800; font-size:11.5px; margin-top:2px; }
.tier .btn { margin-top:8px; }

/* ---------- module / capability rows ---------- */
.mods { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
@media (max-width:860px){ .mods { grid-template-columns:repeat(2,1fr); } }
@media (max-width:540px){ .mods { grid-template-columns:1fr; } }
.mod { background:var(--card); border:1px solid var(--line); border-radius:var(--r-sm);
       padding:15px 17px; display:flex; gap:12px; align-items:flex-start; }
.mod .e { font-size:19px; line-height:1.25; }
.mod b { display:block; font-size:14px; color:var(--ink); }
.mod p { font-size:12.5px; line-height:1.55; margin-top:2px; }

/* ---------- forms ---------- */
.field { display:flex; flex-direction:column; gap:6px; }
.field label { font-size:11px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--ink3); }
.field input, .field select, .field textarea {
  background:var(--paper); border:1.5px solid var(--line-2); border-radius:var(--r-sm);
  padding:11px 13px; color:var(--ink); outline:none; font-size:14px; transition:border-color .15s; width:100%; }
.field input:focus, .field select:focus, .field textarea:focus { border-color:var(--green); }
.field textarea { min-height:96px; resize:vertical; }
.formgrid { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
@media (max-width:600px){ .formgrid { grid-template-columns:1fr; } }
.formnote { font-size:12px; color:var(--ink3); margin-top:10px; }
.formmsg { font-size:13.5px; font-weight:600; border-radius:var(--r-sm); padding:11px 14px; margin-top:12px; display:none; }
.formmsg.ok   { display:block; background:var(--green-soft); color:var(--green-dk); }
.formmsg.err  { display:block; background:var(--terra-soft); color:var(--chip-terra-txt); }

/* ---------- SGS-64 icon system ----------
   One rule set, applied wherever a glyph appears. Weights match the signal
   sheet: 2.4 primary, 3.2 emphasis, 1.4 hairline. Colour is inherited, so a
   glyph on a dark section needs no override. */
.ic { display:inline-flex; width:26px; height:26px; flex:0 0 auto; color:var(--green); }
.ic .sgs { width:100%; height:100%; display:block; }
.sgs { fill:none; stroke:currentColor; stroke-width:2.4;
       stroke-linecap:round; stroke-linejoin:round; }
.sgs .hv    { stroke-width:3.2; }
.sgs .fine  { stroke-width:1.4; opacity:.5; }
.sgs .fill  { fill:currentColor; stroke:none; }
.sgs .fillc { fill:currentColor; stroke:none; }
.sgs .off   { fill:none; stroke:currentColor; stroke-width:1.3; opacity:.35; }
.sgs .bolt  { fill:currentColor; stroke:none; opacity:.5; }

/* the icon replaces the old emoji slot in these two card types */
.mod .ic  { width:24px; height:24px; margin-top:1px; }
.bene .ic { width:26px; height:26px; margin-bottom:2px; }

/* ---------- fine print ---------- */
.fineprint { border-top:1px solid var(--line); margin-top:26px; padding-top:16px;
  font-size:12px; line-height:1.65; color:var(--ink3); }
.fineprint h3 { font-family:var(--font-b); font-size:11px; font-weight:800; letter-spacing:1.6px;
  text-transform:uppercase; color:var(--ink3); margin-bottom:8px; }
.fineprint b { color:var(--ink2); font-weight:700; }
.fineprint ul { list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:4px 20px; margin-top:7px; }
@media (max-width:640px){ .fineprint ul { grid-template-columns:1fr; } }
.fineprint li::before { content:'· '; color:var(--ink3); }

/* ---------- services catalog ---------- */
.ctools { position:sticky; top:62px; z-index:40; background:var(--nav-bg);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line); padding:13px 0; }
.ctools .row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
#csearch { flex:1; min-width:180px; background:var(--card); border:1.5px solid var(--line-2);
  border-radius:999px; padding:10px 17px; font-size:13.5px; color:var(--ink); outline:none;
  transition:border-color .15s; }
#csearch:focus { border-color:var(--green); }
#csearch::placeholder { color:var(--ink3); }
#ccount { font-size:11px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--terra); margin-top:9px; }

.cgroup { margin-top:42px; }
.cgroup h2 { font-size:23px; }
.gblurb { font-size:13.5px; color:var(--ink3); margin:4px 0 16px; }
.clist { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
@media (max-width:760px){ .clist { grid-template-columns:1fr; } }
.citem { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); padding:18px 20px; display:flex; flex-direction:column; gap:8px;
  scroll-margin-top:130px; transition:transform .15s, box-shadow .15s, border-color .15s; }
.citem:hover { transform:translateY(-2px); box-shadow:var(--shadow-h); border-color:var(--line-2); }
.chead { display:flex; align-items:baseline; gap:10px; }
.chead h3 { flex:1; min-width:0; font-size:17px; }
.cprice { font-size:13px; font-weight:800; color:var(--green); white-space:nowrap;
  font-variant-numeric:tabular-nums; }
.cdesc { font-size:13.5px; line-height:1.6; flex:1; }
.cfoot { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.cask { margin-left:auto; font-size:12.5px; font-weight:700; color:var(--green); white-space:nowrap; }
.cask:hover { color:var(--green-dk); }
.empty-note { padding:44px 0; text-align:center; color:var(--ink3); font-size:14px; }

/* ---------- footer ---------- */
.foot { background:var(--coal); padding:44px 0 50px; text-align:center; }
.foot .tag { font-family:var(--font-d); font-style:italic; font-size:17px; color:var(--gold); margin:12px 0 6px; }
.foot .fine { font-size:12px; color:#8b877c; }
.foot .fine a { color:var(--gold); font-weight:600; }
.foot .fl { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:14px;
            font-size:13px; font-weight:600; color:var(--cream-2); }
.foot .fl a:hover { color:var(--gold); }
