/*
Theme Name: Ink 2027
Theme URI: https://inkintheshadows.com
Author: Ink In The Shadows
Description: Editorial theme for Ink In The Shadows: ghostwriting and content writing.
Version: 1.0.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: ink-2027
WPVibe: yes
*/

/* ========== 1. Tokens ========== */
:root{
  --ink:#15121a; --ink-2:#211c27; --ink-3:#2d2734;
  --ivory:#f6f1e7; --paper:#fbf8f2; --sand:#ece4d4; --line:#ddd3c1; --line-dark:rgba(246,241,231,.14);
  --text:#1d1a20; --muted:#5a5460; --muted-dark:#c9c0cf;
  --wine:#7d1630; --wine-2:#5f0f23; --rose:#f2b3c0; --rose-2:#f7cdd6;
  --ok:#1f6b45; --err:#a3122d;
  --serif:"Fraunces", "Iowan Old Style", Georgia, serif;
  --sans:"Hanken Grotesk", "Segoe UI", system-ui, -apple-system, sans-serif;
  --wrap:1200px; --narrow:760px; --gutter:clamp(20px,4vw,40px);
  --r:12px; --r-sm:8px;
  --shadow:0 1px 2px rgba(21,18,26,.06),0 12px 32px -16px rgba(21,18,26,.25);
  --header-h:76px;
  --admin:var(--wp-admin--admin-bar--height,0px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ========== 2. Base ========== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + var(--admin) + 20px)}
@media (max-width:600px){html{scroll-padding-top:calc(var(--header-h) + 20px)}}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--sans);font-size:clamp(16px,1.05vw + 12px,18px);line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--wine);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--wine-2);text-decoration-thickness:2px}
p{margin:0 0 1em;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.1;letter-spacing:-.02em;margin:0 0 .5em;color:inherit;text-wrap:balance;font-optical-sizing:auto}
h1{font-size:clamp(2.5rem,5.2vw,4.75rem)}
h2{font-size:clamp(2rem,3.4vw,3.1rem)}
h3{font-size:clamp(1.3rem,1.6vw,1.6rem);line-height:1.2}
h4{font-size:1.15rem;font-family:var(--sans);font-weight:700;letter-spacing:0}
em,i{font-style:italic}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
ul,ol{padding-left:1.25em;margin:0 0 1.2em}
li{margin:.3em 0}
:focus-visible{outline:3px solid var(--wine);outline-offset:3px;border-radius:4px}
.on-dark :focus-visible,.site-footer :focus-visible,.mnav :focus-visible{outline-color:var(--rose)}
::selection{background:var(--rose);color:var(--ink)}
.screen-reader-text,.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:12px;top:-60px;z-index:1000;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-sm);font-weight:600;text-decoration:none}
.skip-link:focus{top:12px;color:#fff}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* ========== 3. Layout ========== */
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.wrap--narrow{max-width:calc(var(--narrow) + 2*var(--gutter))}
.section{padding:clamp(64px,9vw,120px) 0}
.section--tight{padding:clamp(48px,6vw,80px) 0}
.section--sand{background:var(--ivory)}
.section--line{border-top:1px solid var(--line)}
.on-dark{background-color:var(--ink);background-image:var(--grain);color:var(--ivory)}
.on-dark a:not(.btn){color:var(--rose)}
.on-dark a:not(.btn):hover{color:var(--rose-2)}
.on-dark .muted,.on-dark .lead{color:var(--muted-dark)}
.grid{display:grid;gap:clamp(20px,3vw,32px)}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.split--even{grid-template-columns:repeat(2,minmax(0,1fr))}
.split--form{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.sticky-col{position:sticky;top:calc(var(--header-h) + var(--admin) + 32px)}
@media (max-width:1024px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.split,.split--even,.split--form{grid-template-columns:1fr}.sticky-col{position:static}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

/* ========== 4. Type helpers ========== */
.eyebrow{display:inline-flex;align-items:center;gap:.6em;font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--wine);margin:0 0 1.1rem}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.on-dark .eyebrow{color:var(--rose)}
.lead{font-size:clamp(1.1rem,1.2vw + .6rem,1.35rem);line-height:1.55;color:var(--muted);max-width:40ch}
.muted{color:var(--muted)}
.accent{font-style:italic;color:var(--wine);font-weight:400}
.on-dark .accent{color:var(--rose)}
.sec-num{font-family:var(--serif);font-style:italic;font-size:1rem;color:var(--wine);margin-right:.5em}
.on-dark .sec-num{color:var(--rose)}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px 48px;margin-bottom:clamp(32px,5vw,56px)}
.sec-head h2{margin:0;max-width:18ch}
.sec-head p{margin:0;max-width:46ch;color:var(--muted)}
.on-dark .sec-head p{color:var(--muted-dark)}

/* ========== 5. Buttons ========== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:.8em 1.45em;border-radius:999px;border:1.5px solid transparent;font-family:var(--sans);font-weight:700;font-size:1rem;line-height:1.1;text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s,transform .2s}
.btn:hover{transform:translateY(-1px);text-decoration:none}
.btn svg{width:18px;height:18px;flex:none}
.btn--primary{background:var(--wine);color:#fff}
.btn--primary:hover{background:var(--wine-2);color:#fff}
.btn--ghost{border-color:currentColor;color:var(--ink);background:transparent}
.btn--ghost:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
.on-dark .btn--primary{background:var(--rose);color:var(--ink)}
.on-dark .btn--primary:hover{background:var(--rose-2);color:var(--ink)}
.on-dark .btn--ghost{color:var(--ivory)}
.on-dark .btn--ghost:hover{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.link-arrow{font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:.4em}
.link-arrow::after{content:"\2192";transition:transform .2s}
.link-arrow:hover::after{transform:translateX(3px)}

/* ========== 6. Header ========== */
.site-header{position:sticky;top:var(--admin);z-index:100;background:rgba(251,248,242,.94);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
@media (max-width:600px){.site-header{top:0}}
.site-header__in{display:flex;align-items:center;gap:24px;min-height:var(--header-h)}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:44px;width:auto}
.pnav{margin-left:auto}
.pnav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:4px}
.pnav li{margin:0;position:relative}
.pnav a{display:block;padding:10px 12px;border-radius:var(--r-sm);color:var(--text);font-weight:600;font-size:.95rem;text-decoration:none}
.pnav a:hover,.pnav .current-menu-item>a,.pnav .current-menu-ancestor>a,.pnav .current_page_item>a{color:var(--wine)}
.pnav .current-menu-item>a,.pnav .current_page_item>a{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.pnav .menu-item-has-children>a{padding-right:28px}
.pnav .menu-item-has-children>a::after{content:"";position:absolute;right:12px;top:50%;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg)}
.pnav .sub-menu{position:absolute;left:-8px;top:100%;min-width:290px;display:block;padding:10px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility .18s}
.pnav .sub-menu li{display:block}
.pnav .sub-menu a{padding:9px 12px;font-weight:500}
.pnav .sub-menu a:hover{background:var(--ivory)}
.pnav li:hover>.sub-menu,.pnav li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.hdr-cta{display:flex;align-items:center;gap:16px;flex:none}
.hdr-phone{font-weight:700;color:var(--text);text-decoration:none;white-space:nowrap;font-size:.95rem}
.hdr-phone:hover{color:var(--wine)}
.hdr-cta .btn{min-height:44px;padding:.7em 1.2em;font-size:.95rem}
.menu-toggle{display:none;margin-left:auto;align-items:center;gap:10px;min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);font:700 .95rem var(--sans);cursor:pointer}
.menu-toggle__bars{position:relative;width:18px;height:12px}
.menu-toggle__bars span{position:absolute;left:0;width:100%;height:2px;background:currentColor;border-radius:2px}
.menu-toggle__bars span:nth-child(1){top:0}.menu-toggle__bars span:nth-child(2){top:5px}.menu-toggle__bars span:nth-child(3){top:10px}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
@media (max-width:1180px){.hdr-phone{display:none}}
@media (max-width:1024px){.pnav,.hdr-cta{display:none}.menu-toggle{display:inline-flex}.brand img{height:38px}}
/* Mobile panel */
.mnav{position:fixed;left:0;right:0;bottom:0;top:calc(var(--header-h) + var(--admin));z-index:99;background:var(--ink);background-image:var(--grain);color:var(--ivory);overflow-y:auto;overscroll-behavior:contain;padding:24px var(--gutter) 40px;visibility:hidden}
@media (max-width:600px){.mnav{top:var(--header-h)}.admin-bar .mnav{top:calc(var(--header-h) + var(--admin))}}
.mnav.is-open{visibility:visible}
.mnav ul{list-style:none;margin:0;padding:0}
.mnav>ul>li{border-bottom:1px solid var(--line-dark);margin:0}
.mnav a{display:block;padding:14px 0;color:var(--ivory);text-decoration:none;font-family:var(--serif);font-size:1.6rem;line-height:1.2}
.mnav a:hover,.mnav .current-menu-item>a{color:var(--rose)}
.mnav .sub-menu{padding:0 0 14px 2px}
.mnav .sub-menu a{font-family:var(--sans);font-size:1.02rem;padding:9px 0;color:var(--muted-dark)}
.mnav .sub-menu a:hover{color:var(--rose)}
.mnav__foot{margin-top:28px;display:grid;gap:12px}
.mnav__foot .btn{width:100%}
.mnav__foot .btn--ghost{color:var(--ivory)}
.mnav__foot .btn--primary{background:var(--rose);color:var(--ink)}
.mnav__foot p{margin:8px 0 0;color:var(--muted-dark);font-size:.95rem}
body.nav-open{overflow:hidden}

/* ========== 7. Hero ========== */
.hero{position:relative;overflow:hidden;padding:clamp(72px,11vw,150px) 0 clamp(64px,9vw,120px)}
.hero h1{max-width:15ch;margin-bottom:.4em}
.hero .lead{max-width:46ch;margin-bottom:2rem}
.hero__mark{position:absolute;right:-4vw;bottom:-6vw;font-family:var(--serif);font-style:italic;font-size:clamp(14rem,34vw,34rem);line-height:.8;color:rgba(246,241,231,.035);pointer-events:none;user-select:none}
.trust{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;margin:2.4rem 0 0;padding:1.4rem 0 0;border-top:1px solid var(--line-dark);font-size:.95rem;color:var(--muted-dark)}
.trust li{margin:0;display:flex;align-items:center;gap:.55em}
.trust li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--rose)}
.page-hero{padding:clamp(64px,9vw,120px) 0 clamp(48px,6vw,80px)}
.page-hero h1{max-width:18ch}
.page-hero .lead{max-width:52ch}
.page-hero--light{background:var(--ivory);border-bottom:1px solid var(--line)}
.crumbs{font-size:.88rem;margin-bottom:1.4rem;color:var(--muted)}
.on-dark .crumbs{color:var(--muted-dark)}
.crumbs a{color:inherit}

/* ========== 8. Cards & lists ========== */
.card{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,2.4vw,32px);transition:border-color .2s,transform .2s,box-shadow .2s}
.card h3{margin-bottom:.45em}
.card p{color:var(--muted);margin-bottom:1.2em}
.card .link-arrow{margin-top:auto}
.card--link:hover{border-color:var(--wine);transform:translateY(-2px);box-shadow:var(--shadow)}
.card--link h3 a{color:var(--text);text-decoration:none}
.card--link h3 a::after{content:"";position:absolute;inset:0;border-radius:var(--r)}
.card--link:hover h3 a{color:var(--wine)}
.card__tag{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--wine);margin-bottom:.9rem}
.on-dark .card{background:var(--ink-2);border-color:var(--line-dark)}
.on-dark .card p{color:var(--muted-dark)}
.audience{border-top:2px solid var(--ink);padding-top:22px}
.audience h3{font-size:1.35rem}
.audience p{color:var(--muted);margin:0}
.svc-group{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(20px,4vw,56px);padding:clamp(28px,4vw,44px) 0;border-top:1px solid var(--line)}
.svc-group:last-child{border-bottom:1px solid var(--line)}
.svc-group h3{font-size:1.5rem;margin:0}
.svc-group__intro{color:var(--muted);font-size:.98rem;margin-top:.6em}
@media (max-width:860px){.svc-group{grid-template-columns:1fr}}
.steps{list-style:none;padding:0;margin:0;counter-reset:s;display:grid;gap:0}
.steps li{counter-increment:s;display:grid;grid-template-columns:72px minmax(0,1fr);gap:20px;padding:26px 0;border-top:1px solid var(--line);margin:0}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps li::before{content:"0" counter(s);font-family:var(--serif);font-style:italic;font-size:2.3rem;line-height:1;color:var(--wine)}
.steps h3{margin:0 0 .35em;font-size:1.35rem}
.steps p{margin:0;color:var(--muted)}
.on-dark .steps li{border-color:var(--line-dark)}
.on-dark .steps li::before{color:var(--rose)}
.on-dark .steps p{color:var(--muted-dark)}
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding:12px 0 12px 34px;border-bottom:1px solid var(--line);margin:0}
.ticks li::before{content:"";position:absolute;left:2px;top:19px;width:14px;height:8px;border-left:2px solid var(--wine);border-bottom:2px solid var(--wine);transform:rotate(-45deg)}
.on-dark .ticks li{border-color:var(--line-dark)}
.on-dark .ticks li::before{border-color:var(--rose)}
.ticks strong{display:block;font-weight:700}
.ticks span{color:var(--muted)}
.on-dark .ticks span{color:var(--muted-dark)}
.promise{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line-dark)}
.promise>div{padding:28px 28px 28px 0;border-bottom:1px solid var(--line-dark)}
.promise h3{font-size:1.3rem}
.promise p{color:var(--muted-dark);margin:0;font-size:.98rem}
@media (max-width:860px){.promise{grid-template-columns:1fr}.promise>div{padding-right:0}}
.pull{font-family:var(--serif);font-size:clamp(1.6rem,2.8vw,2.5rem);line-height:1.2;letter-spacing:-.015em;max-width:24ch;margin:0}
.pull em{color:var(--wine)}
.on-dark .pull em{color:var(--rose)}
.note{background:var(--ivory);border-left:3px solid var(--wine);padding:18px 22px;border-radius:0 var(--r-sm) var(--r-sm) 0;margin:1.5rem 0}
.note p:last-child{margin:0}

/* ========== 9. FAQ (native details) ========== */
.faq{border-top:1px solid var(--line)}
.on-dark .faq,.on-dark .faq details{border-color:var(--line-dark)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-family:var(--serif);font-size:clamp(1.15rem,1.4vw,1.4rem);line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;border:1.5px solid currentColor;background:linear-gradient(currentColor,currentColor) center/12px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 12px no-repeat;transition:transform .2s}
.faq details[open] summary::after{background:linear-gradient(currentColor,currentColor) center/12px 1.5px no-repeat;transform:rotate(180deg)}
.faq summary:hover{color:var(--wine)}
.on-dark .faq summary:hover{color:var(--rose)}
.faq .faq__a{padding:0 50px 24px 0;color:var(--muted)}
.on-dark .faq .faq__a{color:var(--muted-dark)}
.faq .faq__a p:last-child{margin:0}
.faq-group+.faq-group{margin-top:56px}
.faq-group h2{font-size:clamp(1.5rem,2vw,2rem);margin-bottom:.6em}

/* ========== 10. CTA band ========== */
.cta-band{padding:clamp(56px,7vw,96px) 0}
.cta-band__in{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:28px}
.cta-band h2{margin:0;max-width:20ch}
.cta-band p{margin:.8em 0 0;max-width:48ch}

/* ========== 11. Forms ========== */
.brief{background:var(--paper);color:var(--text);border-radius:calc(var(--r) + 4px);padding:clamp(24px,3.5vw,44px);box-shadow:var(--shadow);border:1px solid var(--line)}
.brief h2,.brief h3{color:var(--text)}
.brief a:not(.btn){color:var(--wine)}
.brief__title{font-size:clamp(1.6rem,2.2vw,2.1rem);margin-bottom:.3em}
.brief__intro{color:var(--muted);margin-bottom:1.6rem}
.its-brief p{margin:0 0 18px}
.its-brief-row{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media (max-width:640px){.its-brief-row{grid-template-columns:1fr}}
.its-brief label{display:block;font-weight:700;font-size:.92rem;line-height:1.4;color:var(--text)}
.its-brief abbr{color:var(--wine);text-decoration:none;border:0}
.its-brief br{display:none}
.wpcf7 input[type=text],.wpcf7 input[type=email],.wpcf7 input[type=tel],.wpcf7 select,.wpcf7 textarea,.searchform input[type=search]{display:block;width:100%;margin-top:7px;padding:13px 15px;border:1.5px solid #8f8576;border-radius:var(--r-sm);background:#fff;color:var(--text);font:400 1rem/1.4 var(--sans);transition:border-color .15s,box-shadow .15s;appearance:none;-webkit-appearance:none}
.wpcf7 select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2315121a' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;padding-right:40px}
.wpcf7 textarea{min-height:150px;resize:vertical}
.wpcf7 ::placeholder{color:#6f6773}
.wpcf7 input:focus,.wpcf7 select:focus,.wpcf7 textarea:focus,.searchform input:focus{outline:none;border-color:var(--wine);box-shadow:0 0 0 4px rgba(125,22,48,.18)}
.wpcf7 .wpcf7-not-valid{border-color:var(--err);background:#fff7f8}
.wpcf7-not-valid-tip{display:block;color:var(--err);font-size:.88rem;font-weight:600;margin-top:6px}
.its-brief-note{font-size:.9rem;color:var(--muted)}
.wpcf7 .wpcf7-submit{width:100%;min-height:54px;border:0;border-radius:999px;background:var(--wine);color:#fff;font:700 1.05rem var(--sans);cursor:pointer;transition:background-color .2s}
.wpcf7 .wpcf7-submit:hover{background:var(--wine-2)}
.wpcf7 .wpcf7-submit:disabled{opacity:.6;cursor:progress}
.wpcf7-spinner{display:block;margin:10px auto 0}
.wpcf7 form .wpcf7-response-output{margin:16px 0 0;padding:14px 16px;border-radius:var(--r-sm);border:1.5px solid var(--err);background:#fff7f8;color:var(--err);font-weight:600;font-size:.95rem}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--ok);background:#f2faf5;color:var(--ok)}
.wpcf7 form.init .wpcf7-response-output,.wpcf7 form.resetting .wpcf7-response-output,.wpcf7 form.submitting .wpcf7-response-output{display:none}
.ink-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.brief-done{display:none;text-align:left}
.brief-done.is-on{display:block}
.brief-done:focus{outline:none}
.brief-done__icon{width:52px;height:52px;border-radius:50%;background:#e6f3eb;color:var(--ok);display:grid;place-items:center;margin-bottom:18px}
.brief-done h3{font-size:1.7rem}
.brief-done ol{margin:1rem 0 1.4rem;padding-left:1.2em;color:var(--muted)}
.contact-list{list-style:none;padding:0;margin:0}
.contact-list li{padding:16px 0;border-bottom:1px solid var(--line);margin:0}
.contact-list li:first-child{border-top:1px solid var(--line)}
.contact-list span{display:block;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.contact-list a,.contact-list strong{font-family:var(--serif);font-size:1.35rem;font-weight:500;color:var(--text);text-decoration:none;word-break:break-word}
.contact-list a:hover{color:var(--wine)}
.on-dark .contact-list li{border-color:var(--line-dark)}
.on-dark .contact-list span{color:var(--muted-dark)}
.on-dark .contact-list a,.on-dark .contact-list strong{color:var(--ivory)}

/* ========== 12. Blog ========== */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,40px)}
@media (max-width:1024px){.posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.posts{grid-template-columns:1fr}}
.pcard{position:relative;display:flex;flex-direction:column}
.pcard__img{aspect-ratio:3/2;overflow:hidden;border-radius:var(--r);background:var(--sand);margin-bottom:18px}
.pcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.pcard:hover .pcard__img img{transform:scale(1.03)}
.pcard__meta{font-size:.85rem;color:var(--muted);margin-bottom:.6rem;display:flex;flex-wrap:wrap;gap:6px 14px}
.pcard__meta a{position:relative;z-index:2;font-weight:700;color:var(--wine);text-decoration:none;text-transform:uppercase;letter-spacing:.1em;font-size:.75rem}
.pcard h3{font-size:1.35rem;margin-bottom:.5em}
.pcard h3 a{color:var(--text);text-decoration:none}
.pcard h3 a::after{content:"";position:absolute;inset:0}
.pcard:hover h3 a{color:var(--wine)}
.pcard p{color:var(--muted);font-size:.98rem;margin:0}
.pcard--feature{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:center;padding-bottom:clamp(24px,3vw,40px);border-bottom:1px solid var(--line)}
.pcard--feature .pcard__img{margin:0;aspect-ratio:16/10}
.pcard--feature h3{font-size:clamp(1.7rem,2.8vw,2.5rem)}
@media (max-width:860px){.pcard--feature{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 clamp(32px,4vw,48px)}
.chips li{margin:0}
.chips a{display:inline-block;padding:8px 16px;border:1.5px solid var(--line);border-radius:999px;color:var(--text);text-decoration:none;font-weight:600;font-size:.92rem}
.chips a:hover,.chips a[aria-current]{border-color:var(--ink);background:var(--ink);color:var(--ivory)}
.pagination{margin-top:clamp(40px,5vw,64px)}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pagination .page-numbers{display:inline-grid;place-items:center;min-width:46px;height:46px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;text-decoration:none;font-weight:700;color:var(--text)}
.pagination .page-numbers.current,.pagination a.page-numbers:hover{background:var(--ink);border-color:var(--ink);color:var(--ivory)}
/* Article */
.article-head{padding:clamp(56px,8vw,104px) 0 clamp(32px,4vw,48px)}
.article-head h1{font-size:clamp(2.2rem,4.4vw,3.9rem);max-width:22ch}
.article-meta{display:flex;flex-wrap:wrap;gap:8px 22px;color:var(--muted);font-size:.95rem;margin-top:1.4rem}
.article-meta strong{color:var(--text);font-weight:600}
.article-figure{margin:0 auto clamp(32px,5vw,56px);max-width:1100px;padding:0 var(--gutter)}
.article-figure img{width:100%;border-radius:var(--r);aspect-ratio:16/9;object-fit:cover}
.prose{font-size:clamp(1.05rem,.5vw + .9rem,1.18rem);line-height:1.75}
.prose>*{max-width:var(--narrow);margin-left:auto;margin-right:auto}
.prose h2{font-size:clamp(1.65rem,2.4vw,2.2rem);margin-top:2.2em}
.prose h3{font-size:clamp(1.3rem,1.8vw,1.55rem);margin-top:1.8em}
.prose h4{margin-top:1.6em}
.prose>p:first-of-type::first-letter{float:left;font-family:var(--serif);font-size:4.4em;line-height:.82;padding:.06em .1em 0 0;color:var(--wine)}
.prose.no-dropcap>p:first-of-type::first-letter{all:unset}
.prose blockquote{margin:2em auto;padding:0 0 0 24px;border-left:3px solid var(--wine);font-family:var(--serif);font-size:1.3em;line-height:1.45}
.prose blockquote p:last-child{margin:0}
.prose img,.prose figure{border-radius:var(--r-sm);margin:2em auto}
.prose figcaption{font-size:.88rem;color:var(--muted);margin-top:.6em}
.prose table{width:100%;border-collapse:collapse;margin:2em auto;font-size:.95rem;display:block;overflow-x:auto}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top}
.prose th{font-weight:700;background:var(--ivory)}
.prose code{font-size:.9em;background:var(--ivory);padding:.1em .35em;border-radius:4px}
.prose a{word-break:break-word}
.article-cta{max-width:var(--narrow);margin:3.5rem auto 0;padding:clamp(24px,3vw,36px);border-radius:var(--r)}
.article-cta h2{font-size:1.7rem;margin:0 0 .4em}
.article-cta p{color:var(--muted-dark)}
.tags{max-width:var(--narrow);margin:2.5rem auto 0;display:flex;flex-wrap:wrap;gap:8px}
.tags a{font-size:.85rem;padding:6px 12px;border:1px solid var(--line);border-radius:999px;color:var(--muted);text-decoration:none}
.tags a:hover{border-color:var(--wine);color:var(--wine)}
.comments-area{max-width:var(--narrow);margin:4rem auto 0}
.comment-list{list-style:none;padding:0}
.comment-body{padding:18px 0;border-bottom:1px solid var(--line)}
.comment-form input:not([type=submit]):not([type=checkbox]),.comment-form textarea{width:100%;padding:12px 14px;border:1.5px solid #8f8576;border-radius:var(--r-sm);font:inherit}
.comment-form .submit{border:0;border-radius:999px;background:var(--wine);color:#fff;font:700 1rem var(--sans);padding:14px 24px;cursor:pointer}

/* ========== 13. Search & 404 ========== */
.searchform{display:flex;gap:10px;max-width:560px}
.searchform input[type=search]{margin:0}
.searchform button{flex:none;min-height:48px;padding:0 22px;border:0;border-radius:999px;background:var(--wine);color:#fff;font:700 1rem var(--sans);cursor:pointer}
.on-dark .searchform button{background:var(--rose);color:var(--ink)}
.result{padding:26px 0;border-bottom:1px solid var(--line)}
.result h2{font-size:1.5rem;margin:.2em 0 .3em}
.result h2 a{color:var(--text);text-decoration:none}
.result h2 a:hover{color:var(--wine)}
.result p{color:var(--muted);margin:0}
.result__type{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--wine)}

/* ========== 14. Footer ========== */
.site-footer{background:var(--ink);background-image:var(--grain);color:var(--muted-dark);font-size:.97rem}
.site-footer a:not(.btn){color:var(--ivory);text-decoration:none}
.site-footer a:not(.btn):hover{color:var(--rose);text-decoration:underline}
.site-footer .btn--primary{background:var(--rose);color:var(--ink)}
.site-footer .btn--primary:hover{background:var(--rose-2);color:var(--ink)}
.ftr-top{padding:clamp(56px,7vw,96px) 0 40px;display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2.4fr));gap:40px}
@media (max-width:960px){.ftr-top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr-top{grid-template-columns:1fr}}
.ftr-brand img{height:46px;width:auto;margin-bottom:20px}
.ftr-brand p{max-width:34ch}
.ftr-big{font-family:var(--serif);font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.15;color:var(--ivory);margin:0 0 1.2rem;max-width:16ch}
.site-footer h2{font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);margin:0 0 16px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:0 0 10px}
.ftr-bottom{border-top:1px solid var(--line-dark);padding:24px 0 32px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;font-size:.88rem}
.ftr-bottom ul{display:flex;gap:20px}

/* ========== 15. Motion ========== */
@media (prefers-reduced-motion:no-preference){
  .hero .eyebrow,.hero h1,.hero .lead,.hero .btn-row,.hero .trust{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
  .hero h1{animation-delay:.06s}.hero .lead{animation-delay:.14s}.hero .btn-row{animation-delay:.22s}.hero .trust{animation-delay:.3s}
  @keyframes rise{from{transform:translateY(10px)}to{transform:none}}
}

/* ========== 16. Utilities ========== */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mt-2{margin-top:2rem}.mb-2{margin-bottom:2rem}
.center{text-align:center}
.max-30{max-width:30ch}.max-46{max-width:46ch}
.stack>*+*{margin-top:1rem}
