/*
Theme Name: 2Lane Studio
Theme URI: https://2lanestudio.com
Author: 2Lane Studio
Author URI: https://2lanestudio.com
Description: Editorial marketing theme for 2Lane Studio — a design and software development studio. Deep greens, cream canvas, Instrument Serif display type, and a conversion-focused page system. Includes case studies, testimonials, team, FAQ post types, a native contact form, and one-click demo content setup.
Version: 1.0.0
Requires at least: 6.2
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: 2lanestudio
Tags: one-column, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, translation-ready, blog, portfolio
*/

/* =========================================================
   1. DESIGN TOKENS
   (authoritative values from the 2Lane Studio design system)
   ========================================================= */
:root{
  /* base palette */
  --green-primary:#37442C;
  --green-deep:#20291B;
  --cream:#F2EFE6;
  --white-soft:#FAF9F5;
  --gray-muted:#858A80;
  --brass:#A99562;

  /* brass accents — hairline-scale only */
  --brass-bright:oklch(from var(--brass) calc(l + 0.06) c h);
  --line-brass:color-mix(in oklab, var(--brass) 60%, transparent);

  /* derived tones (oklch shifts — never new hues) */
  --green-primary-hover:oklch(from var(--green-primary) calc(l - 0.03) c h);
  --green-primary-press:oklch(from var(--green-primary) calc(l - 0.06) c h);
  --green-tint-08:color-mix(in oklab, var(--green-primary) 8%, transparent);
  --green-tint-14:color-mix(in oklab, var(--green-primary) 14%, transparent);
  --cream-shade:oklch(from var(--cream) calc(l - 0.035) c h);
  --green-deep-raise:oklch(from var(--green-deep) calc(l + 0.04) c h);

  /* semantic surfaces */
  --surface-page:var(--cream);
  --surface-card:var(--white-soft);
  --surface-dark:var(--green-deep);
  --surface-brand:var(--green-primary);
  --surface-inset:var(--cream-shade);

  /* semantic text */
  --text-strong:var(--green-deep);
  --text-body:var(--green-primary);
  --text-muted:var(--gray-muted);
  --text-on-dark:var(--cream);
  --text-on-dark-muted:color-mix(in oklab, var(--cream) 62%, var(--green-deep));
  --text-on-brand-muted:color-mix(in oklab, var(--cream) 62%, var(--green-primary));
  --text-accent:var(--brass);

  /* lines */
  --line-hairline:color-mix(in oklab, var(--green-primary) 18%, transparent);
  --line-strong:color-mix(in oklab, var(--green-primary) 40%, transparent);
  --line-on-dark:color-mix(in oklab, var(--cream) 20%, transparent);

  --focus-ring:var(--brass);

  /* type */
  --font-sans:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --font-serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --type-display-1:clamp(3.25rem,7.5vw,7.5rem);
  --type-display-2:clamp(2.75rem,5.5vw,5rem);
  --type-display-3:clamp(2rem,3.6vw,3.25rem);
  --leading-display:0.94;
  --tracking-display:-0.02em;
  --type-headline-1:clamp(2.5rem,5vw,4.5rem);
  --type-headline-2:clamp(1.875rem,3vw,2.75rem);
  --type-headline-3:1.375rem;
  --leading-headline:1.02;
  --tracking-headline:-0.03em;
  --type-body-lg:1.1875rem;
  --type-body:1.0625rem;
  --type-body-sm:0.9375rem;
  --leading-body:1.55;
  --leading-body-lg:1.5;
  --type-label:0.75rem;
  --type-meta:0.8125rem;
  --tracking-label:0.14em;
  --tracking-meta:0.04em;
  --weight-regular:400;
  --weight-medium:500;
  --weight-semibold:600;
  --weight-bold:700;

  /* spacing */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
  --space-9:96px; --space-10:128px; --space-11:176px;
  --section-y:clamp(64px,9vw,var(--space-10));
  --section-y-lg:clamp(96px,12vw,var(--space-11));
  --gutter:clamp(20px,5vw,var(--space-9));
  --max-width:1440px;
  --measure:64ch;
  --measure-tight:46ch;

  /* borders / radii */
  --radius-0:0px; --radius-1:2px; --radius-2:4px; --radius-3:8px;
  --radius-card:var(--radius-2);
  --radius-control:var(--radius-1);
  --border-hairline:1px solid var(--line-hairline);
  --border-strong:1px solid var(--line-strong);
  --border-on-dark:1px solid var(--line-on-dark);
  --shadow-overlay:0 24px 64px -24px color-mix(in oklab, var(--green-deep) 32%, transparent);

  /* motion */
  --ease-standard:cubic-bezier(0.22,0.61,0.36,1);
  --ease-editorial:cubic-bezier(0.16,1,0.3,1);
  --dur-fast:140ms;
  --dur-base:280ms;
  --dur-slow:520ms;
  --dur-reveal:900ms;
  --marquee-duration:38s;
}
@media (prefers-reduced-motion:reduce){
  :root{--dur-fast:0ms;--dur-base:0ms;--dur-slow:0ms;--dur-reveal:0ms}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* =========================================================
   2. BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-sans);font-size:var(--type-body);line-height:var(--leading-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4,h5,h6{margin:0;color:var(--text-strong);font-weight:var(--weight-medium)}
p{margin:0}
figure{margin:0}
img{max-width:100%;height:auto}
a{color:var(--green-primary);text-decoration:none}
a:hover{color:var(--green-primary-hover)}
button{font:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
::selection{background:var(--green-primary);color:var(--cream)}
.screen-reader-text{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);word-wrap:normal}
.screen-reader-text:focus{position:absolute !important;left:var(--space-4);top:var(--space-4);width:auto;height:auto;padding:var(--space-3) var(--space-5);background:var(--surface-card);color:var(--text-strong);clip:auto;clip-path:none;z-index:100000;border-radius:var(--radius-2)}
.skip-link{left:-9999px;position:absolute}
.skip-link:focus{left:var(--space-4)}

/* type helpers */
.tl-serif{font-family:var(--font-serif);font-weight:var(--weight-regular);line-height:var(--leading-display);letter-spacing:var(--tracking-display)}
.tl-serif em{font-style:italic}
.tl-caps{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase}

/* layout primitives */
.tl-container{max-width:var(--max-width);margin:0 auto}
.tl-section{padding:var(--section-y) var(--gutter)}
.tl-section--tight{padding:clamp(48px,6vw,80px) var(--gutter)}
.tl-section--card{background:var(--surface-card)}
.tl-section--brand{background:var(--surface-brand)}
.tl-section--dark{background:var(--surface-dark)}

/* =========================================================
   3. TWO-LANE MOTIF / EYEBROW
   ========================================================= */
.tl-lanes{display:inline-flex;flex-direction:column;gap:3px;flex:none}
.tl-lanes span{display:block;width:24px;height:1px;background:var(--green-primary)}
.tl-lanes span+span{background:var(--brass)}
.tl-lanes--dark span{background:var(--cream)}
.tl-lanes--dark span+span{background:var(--brass)}
.tl-lanes--mark{gap:4px}
.tl-lanes--mark span{width:26px;height:2px}
.tl-eyebrow{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--green-primary)}
.tl-eyebrow--muted{color:var(--text-muted)}
.tl-eyebrow--on-dark{color:var(--cream)}

/* =========================================================
   4. BUTTONS
   ========================================================= */
.tl-btn{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-weight:var(--weight-medium);letter-spacing:.02em;border:1px solid transparent;border-radius:var(--radius-control);cursor:pointer;text-decoration:none;transition:background var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.tl-btn--sm{padding:10px 16px;font-size:.8125rem}
.tl-btn--md{padding:15px 26px;font-size:.9375rem}
.tl-btn--lg{padding:20px 34px;font-size:1.0625rem}
.tl-btn--primary{background:var(--green-primary);color:var(--cream)}
.tl-btn--primary:hover{background:var(--green-primary-hover);color:var(--cream)}
.tl-btn--primary:active{background:var(--green-primary-press)}
.tl-btn--secondary{background:transparent;color:var(--green-primary);border-color:var(--line-hairline)}
.tl-btn--secondary:hover{background:var(--green-tint-08);border-color:var(--line-strong);color:var(--green-primary)}
.tl-btn--on-dark{background:var(--cream);color:var(--green-primary)}
.tl-btn--on-dark:hover{background:var(--white-soft);color:var(--green-primary)}
.tl-btn--on-dark-ghost{background:transparent;color:var(--cream);border-color:var(--line-on-dark)}
.tl-btn--on-dark-ghost:hover{border-color:var(--cream);color:var(--cream)}
.tl-btn--link{background:transparent;color:var(--green-primary);border:none;border-bottom:1px solid var(--line-strong);border-radius:0;padding:0 0 2px}
.tl-btn--link:hover{border-bottom-color:var(--green-primary);color:var(--green-primary)}
.tl-btn .tl-arrow{display:inline-block;transition:transform var(--dur-base) var(--ease-editorial),color var(--dur-base) var(--ease-standard)}
.tl-btn:hover .tl-arrow{transform:translateX(4px);color:var(--brass-bright)}
.tl-btn--primary:hover .tl-arrow,.tl-btn--on-dark:hover .tl-arrow{color:var(--brass)}

/* =========================================================
   5. SITE HEADER + MOBILE MENU
   ========================================================= */
.tl-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding:var(--space-5) var(--gutter);background:var(--surface-page);border-bottom:var(--border-hairline)}
.tl-header--dark{background:transparent;border-bottom:var(--border-on-dark)}
.tl-wordmark{display:inline-flex;align-items:center;gap:.55em;font-family:var(--font-sans);font-weight:var(--weight-bold);font-size:1.328rem;letter-spacing:-.03em;color:var(--text-strong);text-decoration:none}
.tl-wordmark:hover{color:var(--text-strong)}
.tl-wordmark__text{display:inline-flex;align-items:baseline;gap:.06em}
.tl-wordmark__text .lite{font-weight:var(--weight-regular)}
.tl-header--dark .tl-wordmark{color:var(--cream)}
.tl-header--dark .tl-wordmark:hover{color:var(--cream)}
.tl-wordmark img.custom-logo{display:block;max-height:44px;width:auto}
.tl-nav{display:flex;align-items:center;gap:var(--space-6)}
.tl-nav ul{display:flex;align-items:center;gap:var(--space-6);list-style:none;margin:0;padding:0}
.tl-nav a:not(.tl-btn){position:relative;font-family:var(--font-sans);font-size:var(--type-body-sm);font-weight:var(--weight-medium);letter-spacing:.01em;color:var(--text-body);text-decoration:none}
.tl-nav a:not(.tl-btn)::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;background:currentColor;transition:width var(--dur-base) var(--ease-editorial)}
.tl-nav a:hover::after,.tl-nav .current-menu-item>a::after,.tl-nav .current_page_item>a::after,.tl-nav .current-menu-ancestor>a::after{width:100%}
.tl-header--dark .tl-nav a:not(.tl-btn){color:var(--cream);opacity:.78;transition:opacity var(--dur-base) var(--ease-standard)}
.tl-header--dark .tl-nav a:not(.tl-btn):hover,.tl-header--dark .tl-nav .current-menu-item>a,.tl-header--dark .tl-nav .current_page_item>a{opacity:1}
.tl-menu-trigger{display:none;background:none;border:none;padding:var(--space-2) 0;font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-body);cursor:pointer}
.tl-header--dark .tl-menu-trigger{color:var(--cream)}
@media (max-width:860px){
  .tl-nav{display:none}
  .tl-menu-trigger{display:block}
}
.tl-mobile-menu{position:fixed;inset:0;z-index:60;background:var(--surface-dark);color:var(--cream);display:none;flex-direction:column;padding:var(--space-5) var(--gutter) var(--space-8);overflow-y:auto}
.tl-mobile-menu.is-open{display:flex}
.tl-mobile-menu__top{display:flex;align-items:center;justify-content:space-between}
.tl-mobile-menu__top .tl-wordmark{color:var(--cream)}
.tl-mobile-menu__close{background:none;border:none;color:var(--cream);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;cursor:pointer}
.tl-mobile-menu nav{margin-top:var(--space-8);display:flex;flex-direction:column}
.tl-mobile-menu nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.tl-mobile-menu nav a{display:flex;align-items:baseline;gap:var(--space-5);padding:var(--space-5) 0;border-bottom:var(--border-on-dark);font-family:var(--font-serif);font-size:clamp(2rem,9vw,2.75rem);line-height:1.05;letter-spacing:var(--tracking-display);color:var(--cream);text-decoration:none}
.tl-mobile-menu nav a .num{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);color:var(--brass)}
.tl-mobile-menu__bottom{margin-top:auto;padding-top:var(--space-8)}
.tl-mobile-menu__bottom .tl-btn{width:100%;justify-content:space-between}
.tl-mobile-menu__loc{margin-top:var(--space-5);font-family:var(--font-sans);font-size:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-on-dark-muted)}
body.tl-menu-open{overflow:hidden}

/* =========================================================
   6. HERO
   ========================================================= */
.tl-hero-dark{background:var(--surface-dark)}
.tl-hero-dark__inner{padding:96px var(--gutter) var(--section-y);max-width:var(--max-width);margin:0 auto}
.tl-hero-dark .tl-eyebrow{color:var(--cream)}
.tl-hero-title{margin:48px 0 0;font-family:var(--font-serif);font-weight:var(--weight-regular);line-height:.94;letter-spacing:-.02em;color:var(--cream)}
.tl-hero-title em{font-style:italic}
.tl-hero-lede{font-family:var(--font-sans);font-size:19px;line-height:1.5;color:var(--text-on-dark-muted);max-width:var(--measure-tight)}
.tl-hero-light .tl-hero-title,.tl-hero-light h1{color:var(--text-strong)}
.tl-hero-light .tl-hero-lede{color:var(--text-body)}

/* =========================================================
   7. SECTION HEADER
   ========================================================= */
.tl-section-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-6)}
.tl-section-header__main{flex:1 1 480px;min-width:0;max-width:720px}
.tl-section-header__eyebrow{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--space-5)}
.tl-section-header h2{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:var(--type-headline-2);line-height:1.12;letter-spacing:-.02em;text-wrap:balance;max-width:26ch;color:var(--text-strong)}
.tl-section-header--serif h2{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:var(--type-display-2);line-height:1.04;letter-spacing:var(--tracking-display);max-width:22ch}
.tl-section-header__side{flex:0 1 42ch;max-width:42ch;display:flex;flex-direction:column;gap:var(--space-5);align-items:flex-start;padding-bottom:var(--space-2)}
.tl-section-header__side p{font-size:var(--type-body-lg);line-height:var(--leading-body-lg);color:var(--text-body)}

/* =========================================================
   8. CARDS
   ========================================================= */
/* Process step */
.tl-step{position:relative;display:flex;flex-direction:column;gap:var(--space-4);padding-top:var(--space-5);border-top:var(--border-strong)}
.tl-step::before{content:"";position:absolute;top:-1px;left:0;width:40px;height:1px;background:var(--brass)}
.tl-step__num{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);color:var(--brass)}
.tl-step h3{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:1.125rem;letter-spacing:-.01em;color:var(--text-strong)}
.tl-step p{font-size:var(--type-body-sm);color:var(--text-body);max-width:34ch}
.tl-step--dark{border-top:var(--border-on-dark)}
.tl-step--dark h3{color:var(--cream)}
.tl-step--dark p{color:var(--text-on-dark-muted)}

/* Service card */
.tl-service-card{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6);background:var(--surface-card);border:var(--border-hairline);border-top:1px solid var(--line-hairline);border-radius:var(--radius-card);color:inherit;text-decoration:none;transition:background var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
a.tl-service-card:hover{background:var(--white-soft);border-top-color:var(--green-primary);color:inherit}
.tl-service-card__num{font-family:var(--font-sans);font-size:var(--type-label);letter-spacing:var(--tracking-label);color:var(--brass)}
.tl-service-card h3{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:var(--type-headline-3);line-height:1.2;letter-spacing:-.02em;color:var(--text-strong)}
.tl-service-card p{font-size:var(--type-body-sm);color:var(--text-body);max-width:40ch}
.tl-service-card ul{list-style:none;margin:var(--space-2) 0 0;padding:0;display:grid;gap:var(--space-2)}
.tl-service-card li{display:grid;grid-template-columns:14px 1fr;gap:var(--space-3);font-size:var(--type-body-sm);color:var(--text-muted)}
.tl-service-card li::before{content:"—";color:var(--green-primary)}

/* Media frame (placeholder or image) */
.tl-media{position:relative;background:var(--surface-inset);border:var(--border-hairline);border-radius:var(--radius-card);overflow:hidden;display:flex;align-items:flex-end}
.tl-media--dark{background:var(--green-deep-raise);border:var(--border-on-dark)}
.tl-media__ph{padding:var(--space-5);width:100%}
.tl-media__label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-media--dark .tl-media__label{color:var(--text-on-dark-muted)}
.tl-media__note{margin-top:var(--space-2);font-size:var(--type-body-sm);color:var(--text-muted);max-width:34ch}
.tl-media--dark .tl-media__note{color:var(--text-on-dark-muted)}
.tl-media img{display:block;width:100%;height:100%;object-fit:cover}

/* Portfolio card */
.tl-portfolio-card{display:block;text-decoration:none;color:inherit}
.tl-portfolio-card:hover{color:inherit}
.tl-portfolio-card__media{overflow:hidden;border-radius:var(--radius-card)}
.tl-portfolio-card__media .tl-media{border:none;border-radius:var(--radius-card);transform:scale(1);transition:transform var(--dur-slow) var(--ease-editorial)}
.tl-portfolio-card:hover .tl-portfolio-card__media .tl-media{transform:scale(1.02)}
.tl-portfolio-card__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-5)}
.tl-portfolio-card h3{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:clamp(1.5rem,2.2vw,1.875rem);line-height:1.05;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-portfolio-card--lg h3{font-size:var(--type-display-3)}
.tl-portfolio-card__head .tl-arrow{font-size:1.125rem;color:var(--green-primary);transition:transform var(--dur-base) var(--ease-editorial)}
.tl-portfolio-card:hover .tl-arrow{transform:translateX(4px)}
.tl-portfolio-card__meta{margin-top:var(--space-3);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-portfolio-card>p{margin-top:var(--space-4);max-width:46ch;font-size:var(--type-body);color:var(--text-body)}

/* Testimonial card */
.tl-testimonial{margin:0;padding:var(--space-6);background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card);display:flex;flex-direction:column;gap:var(--space-5)}
.tl-testimonial__ph-label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-testimonial__mark{font-family:var(--font-serif);font-size:2.5rem;line-height:.5;color:var(--brass);margin-bottom:calc(var(--space-3)*-1)}
.tl-testimonial__quote{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:clamp(1.375rem,2vw,1.75rem);line-height:1.22;letter-spacing:-.01em;color:var(--text-strong)}
.tl-testimonial footer{margin-top:auto;display:flex;flex-direction:column;gap:2px}
.tl-testimonial__name{font-size:var(--type-body-sm);font-weight:var(--weight-semibold);color:var(--text-strong)}
.tl-testimonial__org{font-size:var(--type-meta);color:var(--text-muted)}

/* Tag / filter chip */
.tl-tag{display:inline-flex;align-items:center;padding:7px 13px;font-family:var(--font-sans);font-size:var(--type-meta);font-weight:var(--weight-medium);letter-spacing:var(--tracking-meta);border:1px solid var(--line-hairline);border-radius:var(--radius-control);background:transparent;color:var(--text-body);cursor:default;transition:background var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard)}
button.tl-tag,a.tl-tag{cursor:pointer}
button.tl-tag:hover,a.tl-tag:hover{background:var(--green-tint-08);color:var(--text-body)}
.tl-tag.is-active{background:var(--green-primary);color:var(--cream);border-color:transparent}
.tl-tag.is-active:hover{background:var(--green-primary);color:var(--cream)}

/* =========================================================
   9. RULE LISTS (problems / outcomes / deliverables)
   ========================================================= */
.tl-rule-list{display:grid;gap:12px 64px}
.tl-rule-list--2col{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.tl-rule-list__item{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--line-hairline);font-family:var(--font-sans);font-size:17px;line-height:1.5;color:var(--text-body)}
.tl-rule-list__item::before{content:"—";color:var(--brass)}
.tl-rule-list--on-dark .tl-rule-list__item{border-top-color:var(--line-on-dark);color:var(--cream)}
.tl-rule-list--on-brand .tl-rule-list__item{border-top-color:color-mix(in oklab,var(--cream) 20%,transparent);color:var(--cream)}
.tl-dash-list{margin:0;padding:0;list-style:none}
.tl-dash-list li{display:flex;gap:12px;padding:8px 0;font-family:var(--font-sans);font-size:15px;line-height:1.5;color:var(--text-body)}
.tl-dash-list li::before{content:"—";color:var(--brass)}
.tl-dash-list--num li::before{content:attr(data-num)}
.tl-list-label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--space-4)}

/* =========================================================
   10. MARQUEE
   ========================================================= */
.tl-marquee{background:var(--surface-brand);color:var(--cream);overflow:hidden;padding:var(--space-5) 0}
.tl-marquee__track{display:flex;width:max-content;animation:tl-marquee var(--marquee-duration) linear infinite}
.tl-marquee__item{display:inline-flex;align-items:center;gap:var(--space-6);padding-right:var(--space-6);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;white-space:nowrap}
.tl-marquee__item .dot{color:var(--brass)}
@keyframes tl-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* =========================================================
   11. CTA SECTION
   ========================================================= */
.tl-cta{background:var(--surface-dark);color:var(--cream);padding:var(--section-y-lg) var(--gutter)}
.tl-cta--brand{background:var(--surface-brand)}
.tl-cta__eyebrow{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-on-dark-muted);margin-bottom:var(--space-7)}
.tl-cta--brand .tl-cta__eyebrow{color:var(--text-on-brand-muted)}
.tl-cta h2{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:var(--type-display-1);line-height:var(--leading-display);letter-spacing:var(--tracking-display);color:var(--cream);max-width:18ch}
.tl-cta__body{margin-top:var(--space-6);max-width:44ch;font-size:var(--type-body-lg);line-height:var(--leading-body-lg);color:var(--text-on-dark-muted)}
.tl-cta--brand .tl-cta__body{color:var(--text-on-brand-muted)}
.tl-cta__actions{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-8)}

/* =========================================================
   12. FAQ ACCORDION
   ========================================================= */
.tl-accordion{border-bottom:var(--border-hairline)}
.tl-accordion__row{border-top:var(--border-hairline)}
.tl-accordion__row h3{margin:0}
.tl-accordion__q{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-5);padding:var(--space-5) 0;background:none;border:none;text-align:left;cursor:pointer;font-family:var(--font-sans);font-size:1.0625rem;font-weight:var(--weight-medium);letter-spacing:-.01em;color:var(--text-strong)}
.tl-accordion__marker{color:var(--brass);font-size:1.125rem;line-height:1}
.tl-accordion__a{overflow:hidden;max-height:0;opacity:0;transition:max-height var(--dur-base) var(--ease-editorial),opacity var(--dur-base) var(--ease-standard)}
.tl-accordion__row.is-open .tl-accordion__a{max-height:520px;opacity:1}
.tl-accordion__a p{padding-bottom:var(--space-6);max-width:62ch;font-size:var(--type-body);color:var(--text-body)}

/* =========================================================
   13. FORMS
   ========================================================= */
.tl-form-card{background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card);padding:clamp(24px,4vw,48px)}
.tl-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-5)}
.tl-field{display:flex;flex-direction:column;gap:var(--space-2)}
.tl-field label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-field label .req{color:var(--brass)}
.tl-field .hint{font-size:var(--type-meta);color:var(--text-muted)}
.tl-field .error{font-size:var(--type-meta);color:var(--green-primary);font-weight:var(--weight-medium)}
.tl-input,.tl-select select,.tl-textarea{width:100%;padding:14px 16px;font-family:var(--font-sans);font-size:var(--type-body);color:var(--text-strong);background:var(--surface-card);border:1px solid var(--line-hairline);border-radius:var(--radius-control);outline:none;transition:border-color var(--dur-base) var(--ease-standard),background var(--dur-base) var(--ease-standard)}
.tl-input:focus,.tl-select select:focus,.tl-textarea:focus{border-color:var(--line-strong)}
.tl-input[aria-invalid="true"],.tl-select select[aria-invalid="true"],.tl-textarea[aria-invalid="true"]{border-color:var(--green-primary)}
.tl-select{position:relative}
.tl-select select{appearance:none;padding-right:40px;cursor:pointer}
.tl-select::after{content:"▼";position:absolute;right:16px;top:50%;transform:translateY(-55%);font-size:.75rem;color:var(--text-muted);pointer-events:none}
.tl-textarea{resize:vertical;line-height:var(--leading-body)}
.tl-form-footer{display:flex;align-items:center;gap:var(--space-5);margin-top:var(--space-7);flex-wrap:wrap}
.tl-form-note{font-size:var(--type-body-sm);color:var(--text-muted)}
.tl-form-success{padding:var(--space-6) 0}
.tl-form-success h3{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:var(--type-display-3);line-height:1.04;letter-spacing:var(--tracking-display)}
.tl-form-success p{margin-top:var(--space-5);max-width:52ch;color:var(--text-body)}
.tl-hp-field{position:absolute !important;left:-9999px !important;opacity:0;pointer-events:none}
/* search form */
.tl-searchform{display:flex;gap:var(--space-3);max-width:520px}
.tl-searchform .tl-input{flex:1}

/* =========================================================
   14. FOOTER
   ========================================================= */
.tl-footer{background:var(--surface-dark);color:var(--cream);padding:var(--space-9) var(--gutter) var(--space-6)}
.tl-footer__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-8);padding-bottom:var(--space-8);border-bottom:var(--border-on-dark)}
.tl-footer__brand{grid-column:span 2;min-width:0}
@media (max-width:560px){.tl-footer__brand{grid-column:span 1}}
.tl-footer .tl-wordmark{color:var(--cream);font-size:1.5625rem}
.tl-footer__statement{margin-top:var(--space-5);max-width:34ch;font-family:var(--font-serif);font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;letter-spacing:var(--tracking-display);color:var(--cream)}
.tl-footer__label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-on-dark-muted);margin-bottom:var(--space-5)}
.tl-footer__col ul{list-style:none;margin:0;padding:0}
.tl-footer__col a,.tl-footer__col .muted-line{display:block;padding:var(--space-2) 0;font-size:var(--type-body-sm);color:var(--cream);text-decoration:none;opacity:.86}
.tl-footer__col a:hover{opacity:1;color:var(--cream)}
.tl-footer__col .muted-line{opacity:.6}
.tl-footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-6);font-family:var(--font-sans);font-size:var(--type-meta);color:var(--text-on-dark-muted)}
.tl-footer__bottom .loc{letter-spacing:var(--tracking-label);text-transform:uppercase;font-size:var(--type-label)}

/* =========================================================
   15. WORK / PORTFOLIO LAYOUTS
   ========================================================= */
.tl-work-row{display:flex;flex-wrap:wrap;gap:var(--space-8);align-items:flex-start}
.tl-work-cell--lg{flex:1.5 1 420px;min-width:0}
.tl-work-cell--md{flex:1 1 320px;min-width:0}
.tl-work-empty{margin:0;padding:var(--space-8) 0;border-top:var(--border-hairline);font-size:17px;color:var(--text-muted)}
.tl-filters{display:flex;flex-wrap:wrap;gap:var(--space-3)}

/* =========================================================
   16. CONTENT (blog, legal pages)
   ========================================================= */
.tl-prose{max-width:var(--measure)}
.tl-prose>*+*{margin-top:var(--space-5)}
.tl-prose h2{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;letter-spacing:-.02em;margin-top:var(--space-8)}
.tl-prose h3{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:1.25rem;letter-spacing:-.01em;margin-top:var(--space-7)}
.tl-prose p,.tl-prose li{font-size:var(--type-body);line-height:1.6;color:var(--text-body)}
.tl-prose ul,.tl-prose ol{padding-left:1.2em}
.tl-prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.tl-prose blockquote{margin:var(--space-6) 0;padding:0 0 0 var(--space-5);border-left:2px solid var(--brass);font-family:var(--font-serif);font-size:1.375rem;line-height:1.3;color:var(--text-strong)}
.tl-prose img{border-radius:var(--radius-card)}
.tl-prose hr{border:none;border-top:var(--border-hairline);margin:var(--space-8) 0}
.tl-prose code{background:var(--surface-inset);padding:2px 6px;border-radius:var(--radius-1);font-size:.9em}
.tl-prose pre{background:var(--surface-dark);color:var(--cream);padding:var(--space-5);border-radius:var(--radius-card);overflow-x:auto}
.tl-prose pre code{background:none;padding:0}
.tl-prose table{width:100%;border-collapse:collapse}
.tl-prose th,.tl-prose td{text-align:left;padding:var(--space-3) var(--space-4);border-bottom:var(--border-hairline);font-size:var(--type-body-sm)}
.tl-prose th{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.wp-block-image figcaption,.tl-prose figcaption{font-size:var(--type-meta);color:var(--text-muted);margin-top:var(--space-2)}
.alignwide{margin-left:auto;margin-right:auto}
.aligncenter{display:block;margin-left:auto;margin-right:auto}

/* blog cards */
.tl-post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-8) var(--space-6)}
.tl-post-card{display:block;text-decoration:none;color:inherit}
.tl-post-card:hover{color:inherit}
.tl-post-card__media{overflow:hidden;border-radius:var(--radius-card)}
.tl-post-card__media .tl-media{border:none;transition:transform var(--dur-slow) var(--ease-editorial)}
.tl-post-card:hover .tl-post-card__media .tl-media{transform:scale(1.02)}
.tl-post-card__meta{margin-top:var(--space-5);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-post-card h3{margin-top:var(--space-3);font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:clamp(1.5rem,2.2vw,1.875rem);line-height:1.08;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-post-card p{margin-top:var(--space-3);font-size:var(--type-body-sm);color:var(--text-body);max-width:46ch}
.tl-pagination{display:flex;gap:var(--space-3);margin-top:var(--space-9);flex-wrap:wrap}
.tl-pagination .page-numbers{display:inline-flex;align-items:center;padding:10px 16px;font-size:.9375rem;border:1px solid var(--line-hairline);border-radius:var(--radius-control);color:var(--text-body);text-decoration:none}
.tl-pagination .page-numbers.current{background:var(--green-primary);color:var(--cream);border-color:transparent}
.tl-pagination a.page-numbers:hover{background:var(--green-tint-08)}
.tl-post-header-meta{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5);align-items:center}

/* case study meta strip */
.tl-meta-strip{display:flex;flex-wrap:wrap;gap:var(--space-6) var(--space-8);margin-top:56px;padding-top:var(--space-6);border-top:var(--border-on-dark)}
.tl-meta-strip__label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-on-dark-muted)}
.tl-meta-strip__value{margin-top:var(--space-2);font-family:var(--font-sans);font-size:15px;color:var(--cream)}
.tl-cs-blocks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-7)}
.tl-cs-block{padding-top:var(--space-5);border-top:var(--border-strong)}
.tl-cs-block__label{font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--space-4)}
.tl-cs-block p{font-size:var(--type-body);color:var(--text-body);max-width:38ch}
.tl-cs-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-6);margin-top:var(--space-8)}
.tl-cs-metric__value{font-family:var(--font-serif);font-size:clamp(2.25rem,4vw,3.25rem);line-height:1;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-cs-metric__label{margin-top:var(--space-3);font-size:var(--type-meta);color:var(--text-muted)}

/* =========================================================
   17. PRICING / TEAM / CAREERS / EVENTS demo layouts
   ========================================================= */
.tl-pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-6)}
.tl-pricing-card{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-7) var(--space-6);background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card)}
.tl-pricing-card.is-featured{border-color:var(--line-strong);border-top:2px solid var(--green-primary)}
.tl-pricing-card__name{font-family:var(--font-sans);font-weight:var(--weight-semibold);font-size:var(--type-headline-3);letter-spacing:-.02em;color:var(--text-strong)}
.tl-pricing-card__price{font-family:var(--font-serif);font-size:clamp(2rem,3vw,2.75rem);line-height:1;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-pricing-card__price span{font-family:var(--font-sans);font-size:var(--type-body-sm);color:var(--text-muted);letter-spacing:0}
.tl-pricing-card>p{font-size:var(--type-body-sm);color:var(--text-body)}
.tl-pricing-card .tl-dash-list{flex:1}
.tl-team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-8) var(--space-6)}
.tl-team-card h3{margin-top:var(--space-5);font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:1.75rem;line-height:1.08;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-team-card__role{margin-top:var(--space-2);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-team-card p{margin-top:var(--space-4);font-size:var(--type-body-sm);color:var(--text-body);max-width:40ch}
.tl-listing{border-top:var(--border-strong)}
.tl-listing__row{display:flex;flex-wrap:wrap;gap:var(--space-5) var(--space-8);align-items:baseline;justify-content:space-between;padding:var(--space-6) 0;border-bottom:var(--border-hairline)}
.tl-listing__main{flex:1 1 380px;min-width:0}
.tl-listing__row h3{font-family:var(--font-serif);font-weight:var(--weight-regular);font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.08;letter-spacing:var(--tracking-display);color:var(--text-strong)}
.tl-listing__meta{margin-top:var(--space-2);font-family:var(--font-sans);font-size:var(--type-label);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.tl-listing__row p{margin-top:var(--space-3);font-size:var(--type-body-sm);color:var(--text-body);max-width:60ch}

/* sitemap */
.tl-sitemap{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-8)}
.tl-sitemap ul{list-style:none;margin:var(--space-4) 0 0;padding:0}
.tl-sitemap li{padding:var(--space-2) 0;border-bottom:var(--border-hairline)}
.tl-sitemap a{font-size:var(--type-body-sm)}

/* coming soon / landing */
.tl-fullscreen{min-height:100vh;display:flex;flex-direction:column;background:var(--surface-dark)}
.tl-fullscreen__center{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(64px,10vw,160px) var(--gutter);max-width:var(--max-width);margin:0 auto;width:100%}

/* =========================================================
   18. REVEALS
   ========================================================= */
@media (prefers-reduced-motion:no-preference){
  .tl-reveal{opacity:0;transform:translateY(24px);transition:opacity var(--dur-reveal) var(--ease-editorial),transform var(--dur-reveal) var(--ease-editorial)}
  .tl-reveal.is-visible{opacity:1;transform:none}
}

/* =========================================================
   19. GRID HELPERS
   ========================================================= */
.tl-grid{display:grid;gap:var(--space-6)}
.tl-grid--cards{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-5)}
.tl-grid--cards-sm{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-5)}
.tl-grid--steps{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-7) var(--space-6)}
.tl-grid--steps-wide{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-7) var(--space-6)}
.tl-grid--logos{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}
.tl-logo-slot{display:grid;place-items:center;height:84px;border:1px solid var(--line-hairline);border-radius:var(--radius-2);font-family:var(--font-sans);font-size:11px;font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);text-align:center;padding:0 12px}
/* Slots holding an inline SVG mark: the mark is tinted through currentColor. */
.tl-logo-slot--mark{padding:14px 18px;transition:color var(--dur-base,280ms) ease,border-color var(--dur-base,280ms) ease}
.tl-logo-slot--mark:hover{color:var(--green-primary);border-color:var(--line-strong)}
.tl-logo-slot--mark svg{width:100%;height:auto;max-height:56px;display:block;overflow:visible}
.tl-logo-slot__name{font-family:var(--font-sans);font-size:15px;font-weight:700;letter-spacing:.005em;text-transform:none;fill:currentColor}
.tl-logo-slot__sub{font-family:var(--font-sans);font-size:7.6px;font-weight:600;letter-spacing:.19em;fill:currentColor;opacity:.7}
.tl-split{display:flex;flex-wrap:wrap;gap:var(--space-7) var(--space-9)}
.tl-split__a{flex:1 1 340px;min-width:0}
.tl-split__b{flex:1.2 1 380px;min-width:0}