/*
Theme Name: OTN Kadence
Template: kadence
Description: Child theme for outdoorthingsnow. Direction D "Night + Quiet": dark night header, hero and footer, quiet single-column body.
Version: 0.5.3
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: otn-kadence
License: GPL-2.0-or-later
*/

@font-face{font-family:"Big Shoulders Display";src:url(assets/fonts/big-shoulders-display-800.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(assets/fonts/instrument-sans-var.woff2) format("woff2");font-weight:400 700;font-display:swap}

/* Tokens. Night = header, hero, beam band, footer. Day = article body. */
:root:root{
  --night:#0D1417; --night-deep:#081013; --night-ink:#E8EEF0; --night-soft:#A9B7BD; --night-line:#2A3A42; --night-tint:#16232A;
  --beam:#FFD36B;
  --day:#FFFFFF; --ink:#1B1F22; --soft:#5B6368; --line:#DCE3E0; --tint:#F3F6F5; --spruce:#2D6E5C; --cta:#141B1F;
  --display:"Big Shoulders Display",Impact,"Arial Narrow",sans-serif;
  --text:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --global-body-font-family:var(--text);
  --global-heading-font-family:var(--text);
}
body{font-family:var(--text);font-size:18px;line-height:1.6;color:var(--ink);background:var(--day)}
:where(a,button,summary,[tabindex]):focus-visible{outline:3px solid var(--beam);outline-offset:3px}
.entry-content a{color:var(--spruce);text-underline-offset:3px}

/* Header: day bar so the owner's full-colour logo reads as it does on the old site */
#masthead,#masthead .site-header-row-container-inner,#masthead .site-main-header-inner-wrap{background:var(--day)}
#masthead{border-bottom:1px solid var(--line)}
.otn-brand .brand{display:block;line-height:0}
.otn-logo{display:block;width:184px;max-width:100%;height:auto;aspect-ratio:1740/781}
@media (max-width:1024px){.otn-logo{width:148px}}
#masthead .main-navigation .primary-menu-container>ul>li>a{color:var(--ink);font:500 16px/1.2 var(--text);padding-block:28px}
#masthead .main-navigation .primary-menu-container>ul>li>a:hover,#masthead .main-navigation .primary-menu-container>ul>li.current-menu-ancestor>a{color:var(--spruce)}
#masthead .main-navigation ul ul{background:var(--night);box-shadow:0 12px 30px rgba(8,16,19,.25);min-width:240px}
#masthead .main-navigation ul ul li a{color:var(--night-ink);font:500 15px/1.3 var(--text);padding:12px 18px;border:0}
#masthead .main-navigation ul ul li a:hover{background:var(--night-tint);color:var(--beam)}
#masthead .menu-toggle-open,#masthead .search-toggle-open{color:var(--ink)}
#mobile-drawer .drawer-inner{background:var(--night)}
#mobile-drawer .drawer-inner a,#mobile-drawer .drawer-inner button{color:var(--night-ink)}

/* Hero: night sky, ridge and one beam */
.entry-hero.post-hero-section,.entry-hero.page-hero-section{position:relative;overflow:hidden;background-color:var(--night);color:var(--night-ink);
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 520' preserveAspectRatio='none'%3E%3Cpath d='M0 520V370l90-30 110 22 120-60 100 34 140-70 120 48 130-40 110 30 150-62 120 40 150-30v268z' fill='%23081013'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='220'%3E%3Cg fill='%23E8EEF0' fill-opacity='.7'%3E%3Crect x='12' y='20' width='1' height='1'/%3E%3Crect x='80' y='64' width='2' height='2'/%3E%3Crect x='141' y='12' width='1' height='1'/%3E%3Crect x='203' y='90' width='1' height='1'/%3E%3Crect x='260' y='38' width='2' height='2'/%3E%3Crect x='33' y='130' width='1' height='1'/%3E%3Crect x='170' y='150' width='1' height='1'/%3E%3Crect x='240' y='176' width='1' height='1'/%3E%3Crect x='110' y='196' width='2' height='2'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat,repeat;background-size:100% 100%,300px 220px;background-position:bottom,top left}
.entry-hero.post-hero-section::before{content:"";position:absolute;left:18%;top:64%;width:82%;height:34%;transform-origin:0 50%;
  background:linear-gradient(90deg,rgba(255,211,107,.5),rgba(255,211,107,0));clip-path:polygon(0 50%,100% 0,100% 100%);
  animation:otn-beam .9s ease-out both;pointer-events:none}
.entry-hero.post-hero-section::after{content:"";position:absolute;left:calc(18% - 5px);top:calc(64% + 17% - 5px);width:10px;height:10px;border-radius:50%;background:var(--beam)}
@keyframes otn-beam{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.entry-hero .entry-hero-container-inner{background:transparent;position:relative;z-index:1}
.entry-hero .entry-header{min-height:440px;justify-content:flex-start;padding-block:96px 120px;max-width:1180px}
.entry-hero h1.entry-title{font:800 clamp(48px,6.6vw,108px)/.9 var(--display);text-transform:uppercase;letter-spacing:0;color:var(--night-ink);max-width:18ch;text-wrap:balance;margin:0 0 20px}
.entry-hero .entry-meta,.entry-hero .entry-meta a,.entry-hero .kadence-breadcrumbs,.entry-hero .kadence-breadcrumbs a{color:var(--night-soft)}
.entry-hero .entry-taxonomies a{background:var(--night-tint);color:var(--night-ink)}

/* Body: day, one quiet column */
.single-post .content-container.site-container,.page .content-container.site-container{max-width:740px}
.single-post .entry-content,.page .entry-content{font-size:18px;line-height:1.65}
.entry-content :where(h2){font:600 clamp(26px,2.6vw,34px)/1.15 var(--text);letter-spacing:-.01em;color:var(--ink);margin:56px 0 14px;text-wrap:balance}
.entry-content :where(h3){font:600 22px/1.25 var(--text);color:var(--ink)}
.entry-content p{max-width:64ch}

/* Components from OTN Components (shortcodes) */
.otn-disclosure{font:500 15px/1.45 var(--text);color:var(--soft);background:var(--tint);padding:12px 16px;margin:16px 0}
.otn-verdict,.otn-who-box,.otn-method{padding:16px 18px;margin-block:20px;background:var(--tint);border-left:4px solid var(--spruce)}
.otn-verdict>:last-child,.otn-who-box>:last-child,.otn-method>:last-child{margin-bottom:0}
.otn-box-title{font:600 19px/1.2 var(--text);margin:0 0 6px}
.otn-top3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:2px;background:var(--line);list-style:none;margin:20px 0;padding:0}
.otn-top3 li{padding:16px;background:var(--day);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.otn-top3 strong{font:600 19px/1.2 var(--text)}
.otn-table{overflow-x:auto;max-width:100%;margin-block:16px}
.otn-table table{width:100%;border-collapse:collapse;font:16px/1.4 var(--text);font-variant-numeric:tabular-nums;background:var(--day)}
.otn-table th,.otn-table td{padding:14px 12px;text-align:left;border-bottom:1px solid var(--line)}
.otn-table thead th{color:var(--soft);font-weight:600;background:transparent}
.otn-product{display:grid;grid-template-columns:1fr;gap:16px;padding:28px 0;border-top:2px solid var(--line);margin-block:0}
.otn-product h3{margin:0 0 4px;font:600 clamp(24px,2.4vw,30px)/1.1 var(--text)}
.otn-side{display:flex;flex-direction:row;gap:12px;align-items:center}
.otn-ico{width:72px;height:72px;padding:12px;color:var(--ink);background:var(--tint)}
.otn-media{display:block;width:120px;aspect-ratio:1;object-fit:contain;background:#fff}
.otn-asof{font-size:14px;color:var(--soft);margin:0}
.otn-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:10px 0;padding:0}
.otn-chips li{padding:8px 10px;background:var(--tint);font:500 15px/1.3 var(--text)}
.otn-pc{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;margin:12px 0}
.otn-pc h4{margin:0 0 6px;font:600 15px/1.3 var(--text)}
.otn-pc ul{margin:0;padding-left:18px;font-size:16px;line-height:1.5}
.otn-who{font-size:17px}
.otn-unavailable{background:var(--tint);padding-inline:16px}
/* Amazon CTA ("Check price on Amazon"): one shared component for product boxes, the top-3 summary,
   tables and the sticky mobile bar. Colours are tokens (design/tokens.json "cta"); contrast computed:
   default tangerine (owner choice): label 6.56-8.77:1, edge 4.27:1 on white. Only transform and opacity animate. */
:root,[data-cta="tangerine"]{--cta-top:#FF9A3C;--cta-bottom:#F57514;--cta-ink:#1A1206;--cta-edge:#C85A0A;--cta-glow:245,117,20;--cta-radius:12px}
[data-cta="amber"]{--cta-top:#FFC043;--cta-bottom:#F5A00B;--cta-ink:#1A1206;--cta-edge:#B87300;--cta-glow:245,160,11}
:root[data-cta="deep-orange"],[data-cta="deep-orange"]{--cta-top:#CC4A15;--cta-bottom:#AE380A;--cta-ink:#FFFFFF;--cta-edge:#8F2E08;--cta-glow:174,56,10}
.btn-amazon-primary,.btn-table-compact,.btn-sticky-mobile,.otn-product .btn,.otn-top3 .btn,.otn-table .btn,.otn-stick .btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;min-width:44px;padding:14px 24px;border-radius:var(--cta-radius);border:1px solid var(--cta-edge);background:linear-gradient(180deg,var(--cta-top) 0%,var(--cta-bottom) 100%);color:var(--cta-ink);font:700 17px/1.15 var(--text);letter-spacing:.005em;text-align:center;text-decoration:none!important;white-space:normal;text-wrap:balance;max-width:100%;box-sizing:border-box;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 2px rgba(60,30,0,.25),0 8px 18px -8px rgba(var(--cta-glow),.6);transition:transform .16s ease}
.btn-amazon-primary::before,.btn-table-compact::before,.btn-sticky-mobile::before,.otn-product .btn::before,.otn-top3 .btn::before,.otn-table .btn::before,.otn-stick .btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:rgba(255,255,255,.14);opacity:0;transition:opacity .16s ease}
.btn-amazon-primary::after,.btn-table-compact::after,.btn-sticky-mobile::after,.otn-product .btn::after,.otn-top3 .btn::after,.otn-table .btn::after,.otn-stick .btn::after{content:"";position:absolute;inset:0;z-index:-2;border-radius:inherit;box-shadow:0 16px 28px -10px rgba(var(--cta-glow),.75);opacity:0;transition:opacity .16s ease}
.btn .btn-label{position:relative}
.btn .btn-arrow{flex:none;position:relative;transition:transform .16s ease}
@media (hover:hover){
  .btn-amazon-primary:hover,.btn-table-compact:hover,.btn-sticky-mobile:hover,.otn-product .btn:hover,.otn-top3 .btn:hover,.otn-table .btn:hover,.otn-stick .btn:hover{transform:translateY(-2px);color:var(--cta-ink)}
  .btn:hover::before,.btn:hover::after{opacity:1}
  .btn:hover .btn-arrow{transform:translateX(3px)}
}
.btn-amazon-primary:active,.btn-table-compact:active,.btn-sticky-mobile:active,.otn-product .btn:active,.otn-top3 .btn:active,.otn-table .btn:active,.otn-stick .btn:active{transform:translateY(1px) scale(.99)}
.btn:active::after{opacity:0}
.btn-amazon-primary:focus-visible,.btn-table-compact:focus-visible,.btn-sticky-mobile:focus-visible,.otn-product .btn:focus-visible,.otn-top3 .btn:focus-visible,.otn-table .btn:focus-visible,.otn-stick .btn:focus-visible{outline:3px solid #15191C;outline-offset:3px;box-shadow:0 0 0 6px #FFFFFF}
/* Larger: product boxes and the sticky bar. Compact: table rows. */
.otn-product .btn{width:100%;max-width:340px;min-width:min(260px,100%);margin-top:8px}
.btn-sticky-mobile,.otn-stick .btn{min-height:52px;flex:1 1 auto}
.btn-table-compact,.otn-table .btn{min-height:44px;padding:10px 16px;font-size:15px;border-radius:10px;gap:8px;white-space:nowrap}
.btn-table-compact .btn-arrow,.otn-table .btn .btn-arrow{width:16px;height:16px}
.btn[aria-disabled="true"]{background:#E6E9E8;color:#5B6368;border-color:#D3D8D6;box-shadow:none;cursor:not-allowed;transform:none}
.btn[aria-disabled="true"]::before,.btn[aria-disabled="true"]::after{display:none}
@media (max-width:640px){.otn-product .btn,.otn-top3 .btn{width:100%;max-width:none;min-width:0}}
@media (prefers-reduced-motion:reduce){.btn,.btn::before,.btn::after,.btn .btn-arrow{transition:none!important}.btn:hover,.btn:active,.btn:hover .btn-arrow{transform:none!important}}
.otn-faq h3{margin:24px 0 6px}
.otn-toc{padding:14px 18px;background:var(--tint);margin-block:16px}
.otn-toc ul{margin:0;padding-left:18px}
.otn-toc a{display:inline-block;padding-block:8px}
.otn-related{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;list-style:none;margin:16px 0;padding:0}
.otn-related a{display:block;min-height:44px;padding:14px;background:var(--tint);color:var(--ink);text-decoration:none}
.otn-related a:hover{text-decoration:underline}
.otn-stick{display:none}
@media (max-width:760px){
  .otn-stick{display:flex;position:sticky;bottom:0;z-index:5;gap:10px;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--night);color:var(--night-ink)}
  .otn-pc{grid-template-columns:1fr}
  .otn-table{overflow:visible}
  .otn-table table,.otn-table tbody,.otn-table tr,.otn-table th,.otn-table td{display:block;width:100%}
  .otn-table thead{position:absolute;left:-9999px}
  .otn-table tr{border-bottom:2px solid var(--line);padding:6px 0}
  .otn-table tbody th{font-size:18px}
  .otn-table td{display:flex;justify-content:space-between;gap:16px;border:0;padding:6px 0}
  .otn-table td::before{content:attr(data-label);color:var(--soft)}
  .entry-hero .entry-header{min-height:380px;padding-block:72px 120px}
}


/* Beam chart [otn_beam]: a night panel inside the day article */
.otn-beam{margin:32px 0;background:var(--night);color:var(--night-ink);padding:22px 22px 18px}
.otn-beam .otn-box-title{color:#fff;font:800 26px/1 var(--display);text-transform:uppercase;letter-spacing:.01em;margin:0 0 12px}
.otn-beam-fig{overflow-x:auto}
.otn-beam svg{display:block;width:100%;height:auto}
.otn-beam-cone{fill:var(--beam);fill-opacity:.5;transition:fill-opacity .2s}
.otn-beam-row:hover .otn-beam-cone{fill-opacity:.85}
.otn-beam-lamp{fill:var(--beam)}
.otn-beam-name{fill:var(--night-ink);font:600 20px var(--text)}
.otn-beam-val{fill:var(--beam);font:700 20px var(--text)}
.otn-beam-tick{stroke:var(--night-line);stroke-width:1}
.otn-beam-axis{fill:var(--night-soft);font:500 15px var(--text)}
.otn-beam-list{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.otn-beam-note{margin:10px 0 0;font:400 14px/1.5 var(--text);color:var(--night-soft)}

/* Footer: night close, four columns as on the old site */
.otn-footer{background:var(--night);color:var(--night-soft);font:16px/1.55 var(--text);padding:64px max(16px,env(safe-area-inset-right,0px)) 28px max(16px,env(safe-area-inset-left,0px))}
.otn-footer-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr .9fr 1.25fr 1.5fr;gap:40px}
.otn-fcol{min-width:0}
.otn-fcol h2{font:800 22px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--night-ink);margin:0 0 16px}
.otn-fcol h2.otn-brandname{text-transform:none;letter-spacing:.01em;line-height:0}
.otn-flogo{display:block;width:172px;max-width:100%;height:auto;aspect-ratio:1740/781}
.otn-fcol p{margin:0 0 10px}
.otn-fcol ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.otn-fcol a{color:var(--night-ink);text-decoration:none;display:inline-block;padding-block:6px}
.otn-fcol a:hover{color:var(--beam);text-decoration:underline}
.otn-mail{padding-block:6px;user-select:all;font-size:15px;white-space:nowrap}
.otn-fbottom{max-width:1180px;margin:40px auto 0;padding-top:20px;border-top:1px solid var(--night-line);font-size:14px}
@media (max-width:900px){.otn-footer-inner{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.otn-footer-inner{grid-template-columns:1fr;gap:28px}}

@media (prefers-reduced-motion:reduce){
  .entry-hero.post-hero-section::before{animation:none}
  *{transition:none!important}
}
.entry-hero h1.entry-title:lang(tr){text-transform:none}