/*
Theme Name: oneninety8
Theme URI: https://oneninety8.com
Author: Robb Sutton
Author URI: https://robbsutton.com
Description: Custom theme for oneninety8 digital marketing. Marker-editorial design system: dark hero and footer, light content sections, hand-drawn marker accents, Barlow Condensed display type.
Version: 1.7.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oneninety8
*/

:root{
  --bg:#0b0b0d; --bg3:#141518;
  --ink:#f4f4f2; --muted:#b3b6bb; --line:rgba(255,255,255,.10);
  --orange:#ff8029; --orange-soft:rgba(255,128,41,.13);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'Barlow',system-ui,sans-serif;font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--orange);text-decoration:none}
::selection{background:var(--orange);color:#131315}
.wrap{max-width:1160px;margin:0 auto;padding:0 40px}
@media(max-width:640px){.wrap{padding:0 22px}}

h1,h2,h3,h4{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;line-height:1.02;font-weight:900;letter-spacing:0}
.eyebrow{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:3px;font-weight:600;font-size:13.5px;color:var(--orange);margin-bottom:12px}
.lead{color:var(--muted);font-size:18px;max-width:620px}
.scribble{font-family:'Caveat',cursive;font-size:23px;color:var(--orange);display:inline-block;transform:rotate(-2deg)}

/* marker underline */
.mk{position:relative;white-space:nowrap}
.mk svg{position:absolute;left:-2%;bottom:-.12em;width:104%;height:.24em;overflow:visible}
.mk path{fill:none;stroke:var(--orange);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:460;stroke-dashoffset:460}
.mk.in path{transition:stroke-dashoffset .7s ease .15s;stroke-dashoffset:0}
.mk.in path:nth-child(2){transition-delay:.45s}
@media(prefers-reduced-motion:reduce){.mk path{stroke-dashoffset:0;transition:none}}

/* reveal (JS-gated so content is never hidden without JS) */
html.js .rise{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
html.js .rise.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.js .rise{opacity:1;transform:none;transition:none}}

/* buttons */
.btn{display:inline-block;font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:15px;padding:15px 30px;border-radius:10px;transition:background .15s,color .15s,border-color .15s,transform .15s,box-shadow .2s;white-space:nowrap}
.btn--primary{background:var(--orange);color:#161618;border:0}
.btn--primary:hover{background:#f4741c;transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(255,128,41,.55)}
.btn--ghost{background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.35)}
.btn--ghost:hover{color:var(--orange);border-color:var(--orange)}

/* header */
.site-head{position:absolute;top:0;left:0;right:0;z-index:50;padding:26px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px}
@media(max-width:640px){.site-head{padding:18px 22px}}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand__sq{width:46px;height:46px;border-radius:5px;flex:none}
.brand__wm{height:50px;width:auto;display:block}
@media(max-width:640px){.brand__sq{width:40px;height:40px}.brand__wm{height:42px}}
.nav{display:flex;align-items:center;gap:28px}
@media(max-width:960px){.nav{flex-wrap:wrap;justify-content:center;gap:18px}.site-head{flex-direction:column}}
.nav a{font-family:'Barlow Condensed',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:2.5px;font-size:13.5px;color:#c6c9cd;transition:color .15s}
.nav a:hover{color:#fff}
.nav a.is-active{color:var(--orange)}
.nav a.nav__cta{background:var(--orange);color:#161618;font-weight:700;padding:12px 22px;border-radius:9px;transition:background .15s}
.nav a.nav__cta:hover{background:#f4741c;color:#161618}

/* dark zones: flat + grain */
.dark{position:relative;background:var(--bg)}
.dark::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.42'/%3E%3C/svg%3E");opacity:.05;pointer-events:none;z-index:0}
.dark>*{position:relative;z-index:1}

/* hero */
.hero{overflow:hidden}
.hero__grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center;padding:168px 0 100px}
@media(max-width:1080px){.hero__grid{grid-template-columns:1fr;gap:76px;padding:150px 0 80px}}
.hero h1{font-size:clamp(40px,4.4vw,64px)}
.hero .lead{font-size:clamp(17px,1.5vw,19px);max-width:540px;margin:20px 0 32px}
.btn-group{display:flex;gap:16px;flex-wrap:wrap}
.hero__clients{margin-top:46px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hero__clients .lbl{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2.5px;font-size:12px;color:#787d83;font-weight:600}
.hero__clients .name{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:13.5px;color:#c8ccd1;font-weight:700}
.hero__clients .dot{width:5px;height:5px;background:var(--orange);border-radius:50%}

/* hero screenshot: big, tilted, bleeding off the edge */
.hero__visual{position:relative}
.shot{width:130%;max-width:none;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.22);
  transform:perspective(1400px) rotateY(-14deg) rotateX(3deg) rotate(1.5deg);
  box-shadow:0 90px 160px -50px rgba(0,0,0,.95),0 40px 110px -30px rgba(255,128,41,.3)}
.shot img{display:block;width:100%;filter:saturate(1.12) contrast(1.06) brightness(1.06)}
@media(max-width:1080px){.shot{width:100%;max-width:640px;margin:0 auto;transform:none}}
.chip{position:absolute;z-index:3;display:flex;gap:12px;align-items:center;background:#fdfdfb;color:#191a1c;border:1px solid rgba(20,20,26,.18);border-radius:11px;padding:12px 18px 12px 12px;box-shadow:0 16px 40px -12px rgba(0,0,0,.45)}
.chip__ic{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;flex:none}
.chip__ic--green{background:rgba(46,164,79,.14);color:#1f7a37}
.chip__ic--orange{background:var(--orange-soft);color:#e06a10}
.chip b{display:block;font-family:'Barlow',sans-serif;font-weight:600;font-size:14px;line-height:1.25}
.chip small{display:block;font-family:'Caveat',cursive;font-size:16.5px;color:#63666b;line-height:1.15}
.chip--lead{top:48px;left:-34px;transform:rotate(-2deg)}
.chip--mail{bottom:-26px;right:-16px;transform:rotate(1.4deg)}
@media(max-width:1080px){.chip--lead{left:0}.chip--mail{right:0}}

/* inner page hero */
.page-hero{padding:180px 0 76px}
.page-hero h1{font-size:clamp(46px,6.6vw,80px)}
.page-hero .lead{margin-top:18px}

/* light content zone */
.light{--bg:#f7f6f3;--bg2:#edeae5;--bg3:#ffffff;--ink:#191a1c;--muted:#565a60;--line:rgba(22,22,28,.13);
  display:block;background:var(--bg);color:var(--ink)}
.section{padding:88px 0}
.section--alt{background:var(--bg2)}
.section h2{font-size:clamp(34px,4.6vw,54px);margin-bottom:12px}
.section .lead{margin-bottom:44px}

/* outcome strip */
.promises{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;padding:8px 0}
@media(max-width:820px){.promises{grid-template-columns:1fr;gap:28px}}
.promise{border-top:3px solid var(--orange);padding-top:18px}
.promise b{display:block;font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:24px;color:var(--ink);line-height:1.1}
.promise span{display:block;color:var(--muted);font-size:15.5px;margin-top:7px}

/* featured case: open split layout */
.case{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
@media(max-width:900px){.case{grid-template-columns:1fr;gap:40px}}
.case__media img{width:100%;border-radius:14px;border:1px solid var(--line);box-shadow:0 32px 70px -24px rgba(20,20,30,.28)}
.case__body h3{font-size:clamp(30px,3.2vw,40px);margin:4px 0 14px}
.case__body>p{color:var(--muted);margin-bottom:14px;max-width:520px}
.ships{margin:24px 0 30px}
.ships__h{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2.5px;font-size:13px;color:var(--orange);font-weight:700}
.ships ul{list-style:none;margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:11px 28px}
@media(max-width:560px){.ships ul{grid-template-columns:1fr}}
.ships li{display:flex;gap:10px;align-items:flex-start;color:#3d4046;font-size:15px;line-height:1.45}
.ships li svg{color:var(--orange);flex:none;margin-top:3px}
.tlink{display:inline-flex;align-items:center;gap:9px;font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:15px;color:var(--ink);border-bottom:2px solid var(--orange);padding-bottom:3px;transition:color .15s}
.tlink span{transition:transform .18s;color:var(--orange)}
.tlink:hover{color:var(--orange)}
.tlink:hover span{transform:translateX(5px)}

/* pillars: open editorial columns */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:72px}
@media(max-width:860px){.pillars{grid-template-columns:1fr;gap:56px}}
.pillar .num{font-family:'Caveat',cursive;font-weight:700;font-size:46px;color:var(--orange);display:inline-block;transform:rotate(-4deg);line-height:1}
.pillar h3{font-size:34px;margin:2px 0 8px}
.pillar>p{color:var(--muted);margin-bottom:18px}
.plist{list-style:none}
.plist li{padding:14px 0;border-top:1px solid var(--line);color:#3d4046;font-size:16px}
.plist li b{color:var(--ink)}

/* process: 4 open columns */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:48px}
@media(max-width:960px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{border-top:2px solid var(--ink);padding-top:16px}
.step .n{font-family:'Caveat',cursive;font-weight:700;font-size:44px;color:var(--orange);display:inline-block;transform:rotate(-5deg);line-height:1}
.steps--3{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.steps--3{grid-template-columns:1fr}}
.step h4{font-size:21px;letter-spacing:1px;margin:6px 0 8px}
.step p{color:var(--muted);font-size:15.5px}

/* insight rows */
.irows{border-bottom:1px solid var(--line)}
.irow{display:grid;grid-template-columns:170px 1fr auto;gap:26px;align-items:baseline;padding:26px 0;border-top:1px solid var(--line);text-decoration:none}
@media(max-width:720px){.irow{grid-template-columns:1fr;gap:6px}}
.irow__meta{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:12.5px;color:var(--orange);font-weight:700}
.irow__title{font-family:'Barlow Condensed',sans-serif;font-size:26px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink);line-height:1.12;transition:color .15s}
.irow__desc{display:block;font-family:'Barlow',sans-serif;font-size:15px;color:var(--muted);text-transform:none;letter-spacing:0;font-weight:400;margin-top:5px}
.irow__arrow{color:var(--orange);font-size:24px;transition:transform .18s}
.irow:hover .irow__title{color:var(--orange)}
.irow:hover .irow__arrow{transform:translateX(7px)}

/* case study pages */
a.work-card{text-decoration:none}
.glance{border:1px solid var(--line);border-radius:12px;background:var(--bg3);padding:30px 32px}
.glance .h{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2.5px;font-size:13px;color:var(--orange);font-weight:700;margin-bottom:8px}
.glance .row{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
.glance .row:first-of-type{border-top:0}
.glance .row b{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:13.5px;color:var(--muted);font-weight:600}
.glance .row span{color:var(--ink);text-align:right}
.post-meta a{color:var(--orange)}

/* work cards */
.grid{display:grid;gap:26px}
.grid--2{grid-template-columns:1fr 1fr}
@media(max-width:820px){.grid--2{grid-template-columns:1fr}}
.work-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg3);display:flex;flex-direction:column;text-decoration:none;transition:border-color .2s}
.work-card:hover{border-color:var(--ink)}
.work-card__thumb{aspect-ratio:16/9;overflow:hidden;display:grid;place-items:center;font-family:'Caveat',cursive;font-weight:700;font-size:54px;color:#fff}
.work-card__thumb img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .35s ease}
.work-card:hover .work-card__thumb img{transform:scale(1.025)}
.work-card__body{padding:26px 28px 30px}
.work-card__cat{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2.5px;font-size:12.5px;color:var(--orange);font-weight:700}
.work-card__title{font-family:'Barlow Condensed',sans-serif;font-size:27px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink);margin:6px 0 8px}
.work-card__text{color:var(--muted);font-size:15.5px}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.tag{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:#4a4e54;border:1px solid rgba(22,22,28,.2);border-radius:6px;padding:4px 10px}

/* founder note */
.note{display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:start;border-left:3px solid var(--orange);padding:8px 0 8px 32px;max-width:900px}
@media(max-width:640px){.note{grid-template-columns:1fr}}
.note img{width:66px;height:66px;border-radius:8px;transform:rotate(-4deg);border:1.5px solid var(--ink)}
.note p{color:#2e3136;font-size:18.5px;line-height:1.55}
.note .sig{font-family:'Caveat',cursive;font-size:29px;color:var(--orange);margin-top:12px;display:block;transform:rotate(-2deg)}

/* typographic closer */
.closer{padding:96px 0 108px}
.closer h2{font-size:clamp(42px,5.6vw,72px)}
.closer p{color:var(--muted);font-size:17.5px;max-width:560px;margin-top:16px}
.closer__row{display:flex;align-items:center;gap:26px;margin-top:34px;flex-wrap:wrap}

/* contact */
.contact-panel{border:1px solid var(--line);border-radius:12px;background:var(--bg3);padding:36px}
.contact-panel h3{font-size:25px;margin-bottom:16px}
.c-row{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line)}
.c-row:first-of-type{border-top:0}
.c-row__icon{color:var(--orange);flex:none;margin-top:3px}
.c-row b{display:block;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:13.5px;color:var(--ink)}
.c-row span{color:var(--muted);font-size:15.5px}
form .frow{margin-bottom:16px}
label{display:block;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:13px;color:#3d4046;margin-bottom:7px}
input,textarea,select{width:100%;background:#fff;border:1px solid rgba(22,22,28,.18);border-radius:8px;color:#191a1c;padding:13px 15px;font-family:'Barlow',sans-serif;font-size:15.5px}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--orange)}
input::placeholder,textarea::placeholder{color:#9a9ea5}
.faq details{border-top:1px solid var(--line);padding:20px 4px}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::after{content:"+";color:var(--orange);font-size:26px;font-weight:400}
.faq details[open] summary::after{content:"\2013"}
.faq details p{color:var(--muted);margin-top:12px;font-size:15.5px}

/* post prose (single posts + long-form pages) */
.prose{max-width:760px}
.prose p{margin:0 0 24px;color:#2e3136;font-size:17.5px;line-height:1.75}
.prose h2{font-size:clamp(26px,3vw,36px);margin:46px 0 18px;color:var(--ink)}
.prose h3{font-size:23px;margin:38px 0 14px;color:var(--ink)}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose a{color:#c25a0a;text-decoration:underline;text-decoration-color:rgba(255,128,41,.5);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--orange)}
.prose img{border-radius:12px;margin:36px 0;box-shadow:0 26px 55px -22px rgba(20,20,30,.28)}
.prose figure{margin:36px 0}
.prose figure img{margin:0}
.prose figcaption{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#8a8e94;margin-top:12px}
.prose ul,.prose ol{margin:0 0 24px 24px;color:#2e3136;font-size:17px;line-height:1.7}
.prose li{margin-bottom:10px}
.prose blockquote{border-left:3px solid var(--orange);padding:4px 0 4px 26px;margin:38px 0;font-size:21px;line-height:1.5;color:var(--ink);font-weight:500}
.prose blockquote p{margin:0;font-size:inherit;color:inherit}
.prose hr{border:0;border-top:1px solid var(--line);margin:46px 0}
.prose strong{color:var(--ink)}
.prose iframe,.prose video{max-width:100%;border-radius:12px;margin:36px 0}
.post-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:18px;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:13.5px;color:#9aa0a6}
.post-meta .dot{width:4px;height:4px;background:var(--orange);border-radius:50%}
.post-foot{border-top:1px solid var(--line);margin-top:52px;padding-top:28px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center}
/* post hero: title left, featured image right, one shared band */
.post-hero{padding:140px 0 64px}
.post-hero__grid{display:grid;grid-template-columns:1fr;gap:44px;align-items:center}
.post-hero--cover .post-hero__grid{grid-template-columns:1.05fr .9fr}
@media(max-width:960px){.post-hero--cover .post-hero__grid{grid-template-columns:1fr;gap:36px}}
.post-hero h1{font-size:clamp(32px,3.6vw,52px)}
.post-hero__img img{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.18);box-shadow:0 40px 80px -30px rgba(0,0,0,.75)}
/* form notices + honeypot */
.form-note{border-radius:10px;padding:14px 18px;margin-bottom:20px;font-size:15.5px;border:1px solid}
.form-note--ok{background:rgba(46,164,79,.08);border-color:rgba(46,164,79,.35);color:#1f7a37}
.form-note--err{background:rgba(224,69,90,.07);border-color:rgba(224,69,90,.35);color:#b13246}
.hp-field{position:absolute !important;left:-9999px !important;height:1px;width:1px;overflow:hidden}
/* pagination */
.page-numbers{display:inline-flex;gap:8px;list-style:none}
a.page-numbers,span.page-numbers{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:1px;padding:9px 15px;border:1px solid var(--line);border-radius:8px;color:var(--ink)}
span.page-numbers.current{background:var(--orange);border-color:var(--orange);color:#161618}
a.page-numbers:hover{border-color:var(--orange);color:var(--orange)}

/* footer */
.site-foot{background:#0a0a0c;border-top:1px solid rgba(255,255,255,.08);padding:64px 0 34px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:44px}
@media(max-width:800px){.foot-grid{grid-template-columns:1fr}}
.foot-blurb{color:#a9adb3;font-size:15px;max-width:380px;margin-top:18px}
.foot-h{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:2.5px;font-size:14px;color:#fff;font-weight:700;margin-bottom:16px}
.foot-links{list-style:none}
.foot-links li{margin-bottom:10px}
.foot-links a{color:#a9adb3;font-size:15px;transition:color .15s}
.foot-links a:hover{color:var(--orange)}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:#7d8288;font-size:13.5px}
