:root{color-scheme:light;--paper:#f8f6f0;--ink:#182521;--green:#195d4a;--line:#c7cec3}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Hiragino Sans","Yu Gothic",system-ui,sans-serif;font-size:16px;line-height:1.85;overflow-wrap:anywhere}
a{color:inherit;text-underline-offset:.24em}a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.wrap{width:min(100% - 3rem,68rem);margin-inline:auto}
header .wrap,footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1.15rem}header .wrap{border-bottom:1px solid var(--line)}
header strong{color:var(--green);font:700 1.4rem Georgia,serif}header a{font-size:.86rem}
.hero{padding-block:clamp(3.5rem,10vw,7.5rem) clamp(3.25rem,7vw,5rem)}
h1{color:var(--green);font:400 clamp(5.1rem,16vw,11rem)/.82 Georgia,serif;letter-spacing:-.075em;margin:0 0 1.6rem}
.brand-reading{font:500 .84rem/1.5 system-ui,sans-serif;letter-spacing:.12em;margin:0 0 2rem}
.lead{font-size:clamp(1.4rem,3.1vw,2.25rem);font-weight:650;line-height:1.5;margin:0 0 1.25rem}
.hero .intro{max-width:38rem;margin:0}
.panel{display:grid;grid-template-columns:minmax(9rem,1fr) minmax(0,2fr);gap:clamp(1rem,4vw,3rem);border-top:1px solid var(--line);padding-block:2.45rem}
h2,h3,p{margin:0}h2{font-size:1.12rem;color:var(--green)}h3{font-size:1rem}
.row+.row{margin-top:1.15rem}.row p,.note{margin-top:.2rem}.note{font-size:.92rem}
.contact{background:var(--green);color:white}.contact .panel{border:0}.contact h2{color:white}.contact a{font-size:1.15rem;font-variant-numeric:tabular-nums}
footer{font-size:.82rem}
@media(max-width:600px){.wrap{width:calc(100% - 2rem)}.panel{grid-template-columns:1fr;padding-block:1.8rem}}

header nav{display:flex;flex-wrap:wrap;justify-content:flex-end;column-gap:.85rem;row-gap:.25rem}header nav [aria-current="page"]{font-weight:700;text-decoration:none}

:root {
  --paper: #fcfafb;
  --ink: #1b2550;
  --green: #1a3f9e;
  --line: #e3d6dc;
  --accent: #f6dde5;
  --brand-font: "Arial Rounded MT Bold", "Nunito", "Trebuchet MS", sans-serif;
}
:root[data-palette="green"] {
  --paper: #f8f6f0;
  --ink: #182521;
  --green: #195d4a;
  --line: #c7cec3;
  --accent: #e3ede0;
}
header strong, h1 { font-family: var(--brand-font); font-weight: 700; }
h1 { letter-spacing: -.04em; }
.brand-reading { color: var(--green); }
.contact form { display: grid; gap: .85rem; margin-top: 1.25rem; max-width: 32rem; }
.contact label { display: grid; gap: .25rem; font-size: .9rem; }
.contact input, .contact textarea, button { font: inherit; }
.contact input, .contact textarea { width: 100%; padding: .55rem .7rem; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: .3rem; }
.contact button { justify-self: start; padding: .42rem 1rem; background: var(--accent); color: var(--green); border: 0; border-radius: .3rem; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.theme-toggle { background: transparent; border: 1px solid var(--line); color: var(--green); padding: .2rem .55rem; border-radius: .3rem; }
footer .wrap { flex-wrap: wrap; }

/* palette accents: deep ultramarine for reading, a quiet sky blue as a second accent */
:root:not([data-palette="green"]) { --deep: #1c3594; --sky: #a9d6f0; }
:root[data-palette="green"] { --deep: var(--green); --sky: var(--line); }
h2, h3, .role { color: var(--deep); }
.contact h2, .contact h3 { color: white; }
header .wrap { border-bottom: 2px solid var(--sky); }
.definition { border-left-color: var(--sky); }
.services li::marker { color: var(--sky); }
.contact .wrap.panel { border-top: 3px solid var(--sky); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; }

/* added: new sections */
.hero .sub { font-size: 1.05rem; margin: 0 0 1rem; max-width: 40rem; }
.stack > * + * { margin-top: .9rem; }
.services { margin: 0; padding-left: 1.2rem; }
.services li + li { margin-top: .35rem; }
.role { color: var(--green); }
.role .gloss { color: var(--ink); font-size: .9rem; }
.definition { font-size: 1.12rem; font-weight: 650; border-left: 3px solid var(--accent); padding-left: .9rem; }
.thanks-h { font-size: clamp(2.6rem, 8vw, 5rem); }
.hero-small { padding-block: clamp(2.5rem, 7vw, 4.5rem) 2rem; }
footer a { margin-inline-start: auto; }
.ga-reset { font: inherit; font-size: .92rem; padding: .45rem 1rem; background: transparent; color: var(--green); border: 1px solid var(--green); border-radius: .3rem; }
#gaBar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: var(--paper); border-top: 1px solid var(--line); box-shadow: 0 -2px 14px rgba(0,0,0,.06); padding: 14px 20px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
#gaBar p { margin: 0; flex: 1 1 320px; font-size: .86rem; line-height: 1.75; }
#gaBar a { color: var(--green); }
.gabtns { display: flex; gap: 10px; flex: none; }
/* both buttons look the same: neither choice is nudged */
.gabtns button { font: inherit; font-size: .86rem; padding: 9px 20px; border-radius: 6px; cursor: pointer; white-space: nowrap; background: var(--paper); color: var(--green); border: 1px solid var(--green); }
.gabtns button:hover { background: var(--accent); }
@media (max-width: 620px) { #gaBar { padding: 13px 16px; gap: 12px; } .gabtns { width: 100%; } .gabtns button { flex: 1; padding: 11px 0; } }
