/*
Theme Name: Todorov Consulting
Theme URI: https://todorovconsulting.com
Author: Todorov Consulting
Description: Bilingual (English at /, Bulgarian at /bg/) one-page theme for Todorov Consulting: strategy, sales and development advisory. Edit contact details and the About text under Appearance > Customize > Todorov details.
Version: 1.3.1
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: todorov
*/

/* Layout: an asymmetric ledger. A narrow left margin carries section names; content runs in a wide right column.
   One bold moment: the hero's oversized name set against a single drawn trajectory. Everything else stays quiet. */
:root{
  --paper:#E8EAE4;      /* cool stone */
  --paper-2:#DDE0D8;
  --ink:#16302A;        /* bottle green */
  --ink-soft:#4A5E57;
  --rule:#BFC6BC;
  --brass:#8F6F2E;      /* aged brass accent */
  --field:#F3F4F0;
  --display:"Gloock","Bodoni 72","Didot",Georgia,serif;
  --body:"Commissioner","Helvetica Neue",Arial,sans-serif;
  --step--1:.875rem; --step-0:1.0625rem; --step-1:1.3rem; --step-2:1.75rem; --step-3:2.6rem; --step-4:clamp(3.4rem,11vw,9.5rem);
  --gutter:clamp(16px,5vw,72px);
  --deep:#16302A; --deep-ink:#E8EAE4; --deep-soft:#A9B9B1; --deep-rule:#2F4A42; --brass-lit:#C9A55E; --deep-field:#1D3A33;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#0F1F1B;--paper-2:#14271F;--ink:#E3E6DE;--ink-soft:#A3B0A9;--rule:#2C3F38;--brass:#C9A55E;--field:#172C25;
  --deep:#08130F;--deep-rule:#1F3029;--deep-field:#0F1F1B;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#0F1F1B;--paper-2:#14271F;--ink:#E3E6DE;--ink-soft:#A3B0A9;--rule:#2C3F38;--brass:#C9A55E;--field:#172C25;
  --deep:#08130F;--deep-rule:#1F3029;--deep-field:#0F1F1B;color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:var(--step-0);line-height:1.6;font-weight:400;-webkit-font-smoothing:antialiased}
.wrap{max-width:1240px;margin:0 auto;padding-inline:var(--gutter)}
a{color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:400;text-wrap:balance;margin:0;line-height:1.05}
p{margin:0}

/* nav */
header.top{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding-block:28px;flex-wrap:wrap}
.mark{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.mark svg{width:46px;height:46px;flex:none}
.mark .word{display:flex;flex-direction:column;gap:3px}
.mark b{font-family:"Gloock","Bodoni 72","Didot",Georgia,serif;font-weight:400;font-size:1.6rem;line-height:.9}
.mark small{font-size:.62rem;font-weight:500;letter-spacing:.32em;color:var(--brass)}
header.top{align-items:center}
nav{display:flex;gap:28px;flex-wrap:wrap;font-size:var(--step--1)}
nav a{text-decoration:none;color:var(--ink-soft);border-bottom:1px solid transparent;padding-bottom:2px}
nav a:hover{color:var(--ink);border-color:var(--brass)}

/* hero */
.hero{position:relative;padding-block:clamp(40px,8vw,96px) clamp(48px,7vw,88px);border-bottom:1px solid var(--rule)}
.hero h1{font-size:var(--step-4);letter-spacing:-.02em;line-height:.92;position:relative;z-index:1}
.hero h1 .second{display:block;padding-left:clamp(0px,14vw,220px)}
.trajectory{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.trajectory path{fill:none;stroke:var(--brass);stroke-width:1.4}
.trajectory circle{fill:var(--paper);stroke:var(--brass);stroke-width:1.4}
.hero-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(24px,5vw,80px);margin-top:clamp(40px,6vw,72px);position:relative;z-index:1}
.hero-foot .lede{font-size:var(--step-1);line-height:1.45;max-width:34ch}
.hero-foot .aside{color:var(--ink-soft);max-width:46ch;align-self:end}
.btn{display:inline-block;margin-top:26px;padding:17px 32px;background:var(--ink);color:var(--paper);text-decoration:none;font-family:var(--body);font-weight:600;font-size:1.02rem;line-height:1.2;letter-spacing:.005em;border:1px solid var(--ink);border-radius:1px;transition:background .2s,color .2s,box-shadow .2s}
.btn:hover{background:transparent;color:var(--ink)}

/* ledger sections */
.ledger{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:clamp(20px,5vw,72px);padding-block:clamp(56px,8vw,112px);border-bottom:1px solid var(--rule)}
.ledger > .label{font-family:var(--display);font-size:var(--step-1);color:var(--brass);position:sticky;top:calc(env(safe-area-inset-top,0px) + 24px);align-self:start}
.ledger h2{font-size:var(--step-3);max-width:20ch;margin-bottom:28px}
.intro{max-width:62ch;color:var(--ink-soft)}

/* disciplines */
.disciplines{margin-top:56px;display:grid;gap:0}
.disc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(16px,4vw,56px);padding-block:32px;border-top:1px solid var(--rule)}
.disc h3{font-size:var(--step-2)}
.disc p{max-width:58ch}
.disc ul{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--ink-soft);font-size:var(--step--1)}
.disc li::before{content:"";display:inline-block;width:6px;height:6px;border:1px solid var(--brass);border-radius:50%;margin-right:8px;vertical-align:middle}

/* situations */
.situations{margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,56px)}
.situations p{font-family:var(--display);font-size:var(--step-1);line-height:1.3;padding-block:22px;border-top:1px solid var(--rule)}

/* process */
.steps{margin:48px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,3vw,40px);counter-reset:s}
.steps li{counter-increment:s;padding-top:18px;border-top:2px solid var(--ink)}
.steps li::before{content:counter(s);font-family:var(--display);font-size:var(--step-2);color:var(--brass);display:block;margin-bottom:10px;font-variant-numeric:tabular-nums}
.steps h3{font-family:var(--body);font-weight:600;font-size:var(--step-0);margin-bottom:6px}
.steps p{color:var(--ink-soft);font-size:var(--step--1)}
.steps .dur{display:block;margin-top:10px;font-size:var(--step--1);color:var(--ink);font-variant-numeric:tabular-nums}

/* formats */
.formats{margin-top:48px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--rule)}
.fmt{padding:28px;display:flex;flex-direction:column;gap:12px}
.fmt + .fmt{border-left:1px solid var(--rule)}
.fmt.feature{background:var(--ink);color:var(--paper)}
.fmt.feature .meta{color:var(--paper);opacity:.75}
.fmt h3{font-size:var(--step-2)}
.fmt .meta{font-size:var(--step--1);color:var(--ink-soft);font-variant-numeric:tabular-nums}
.fmt p{font-size:.98rem}

/* about */
.about{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,5vw,72px)}
.about blockquote{margin:0;font-family:var(--display);font-size:var(--step-2);line-height:1.25;max-width:24ch}
.about .bio{display:flex;flex-direction:column;gap:16px;color:var(--ink-soft);max-width:52ch}
.monogram{width:clamp(96px,14vw,140px);aspect-ratio:1;max-width:100%;border:1px solid var(--brass);border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:clamp(2.4rem,5vw,3.4rem);color:var(--brass);margin-bottom:28px}

/* contact */
.contact{background:var(--paper-2)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px)}
.contact .detail{display:flex;flex-direction:column;gap:20px}
.contact .detail div span{display:block;font-size:var(--step--1);color:var(--ink-soft)}
.contact .detail strong{font-weight:500;font-size:var(--step-1);user-select:all}
form{display:grid;gap:18px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
label{display:flex;flex-direction:column;gap:6px;font-size:var(--step--1);color:var(--ink-soft)}
input,select,textarea{font:inherit;font-size:var(--step-0);color:var(--ink);background:var(--field);border:1px solid var(--rule);border-radius:2px;padding:12px 14px;width:100%}
textarea{min-height:140px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brass)}
form .btn{margin-top:4px;justify-self:start;cursor:pointer}
.sent{font-family:var(--display);font-size:var(--step-1);padding:28px;border:1px solid var(--brass)}

footer{padding-block:36px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:var(--step--1);color:var(--ink-soft)}

/* dark bands: the same components, re-tokened */
.band-dark{--paper:var(--deep);--ink:var(--deep-ink);--ink-soft:var(--deep-soft);--rule:var(--deep-rule);--brass:var(--brass-lit);--field:var(--deep-field);
  background:var(--paper);color:var(--ink);position:relative;overflow:hidden}
.hero-band .hero{border-bottom:0}
.contours{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.contours path,.contours ellipse{fill:none;stroke:var(--brass);stroke-width:1;opacity:.16}
.hero-band .wrap{position:relative;z-index:1}
.trajectory path{stroke-width:2;stroke-dasharray:1700;stroke-dashoffset:0;animation:draw 2.4s cubic-bezier(.6,.1,.2,1) both}
.trajectory circle{animation:pop .5s ease-out both}
.trajectory circle:nth-of-type(1){animation-delay:.9s}
.trajectory circle:nth-of-type(2){animation-delay:1.6s}
.trajectory circle:nth-of-type(3){animation-delay:2.2s;fill:var(--brass)}
@keyframes draw{from{stroke-dashoffset:1700}}
@keyframes pop{from{opacity:0}}
.btn-brass{background:var(--brass);border-color:var(--brass);color:var(--deep)}
.btn-brass:hover{background:transparent;color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.band-dark .situations p{transition:color .25s}
.band-dark .situations p:hover{color:var(--brass)}

/* discipline icons */
.disc-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.ico{width:46px;height:46px;fill:none;stroke:var(--brass);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ico .fill{fill:var(--brass);stroke:none}
.disc h3{transition:color .25s}
.disc:hover h3{color:var(--brass)}
.figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding-bottom:22px;margin-bottom:6px;border-bottom:1px solid var(--rule)}
.figures div{display:flex;flex-direction:column;gap:6px}
.figures b{font-family:var(--display);font-weight:400;font-size:clamp(2.6rem,6vw,3.6rem);line-height:1;color:var(--brass);font-variant-numeric:tabular-nums}
.figures span{font-size:var(--step--1);color:var(--ink-soft);line-height:1.4}
.emblem{width:clamp(96px,14vw,140px);height:auto;max-width:100%;color:var(--ink);margin-bottom:28px;display:block}

@media (max-width:860px){
  .ledger{grid-template-columns:1fr}
  .ledger > .label{position:static}
  .hero-foot,.about,.contact-grid,.disc{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .formats{grid-template-columns:1fr}
  .fmt + .fmt{border-left:0;border-top:1px solid var(--rule)}
}
@media (max-width:520px){
  .situations,.row,.steps{grid-template-columns:1fr}
  nav{gap:18px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* language */
:root:lang(bg){--display:"Prata","Bodoni 72","Didot",Georgia,serif}
:lang(bg) h1,:lang(bg) h2{letter-spacing:-.01em}
:lang(bg) .hero h1{font-size:clamp(2.8rem,8.4vw,7.2rem);line-height:1}
.lang{display:flex;gap:2px;margin-left:8px;padding-left:20px;border-left:1px solid var(--rule)}
.lang a{padding:2px 6px;border-bottom:0;color:var(--ink-soft)}
.lang a[aria-current="true"]{color:var(--brass)}
.portrait{display:block;width:calc(100% - 20px);max-width:340px;height:auto;aspect-ratio:4/5;object-fit:cover;margin:10px 10px 40px;outline:1px solid var(--brass);outline-offset:10px;background:var(--paper-2)}

/* WordPress additions */
.contact .ledger{border-bottom:0}
.contact .detail a{text-decoration:none}
.contact .detail a:hover{color:var(--brass)}
.trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{padding:14px 18px;border:1px solid var(--brass);margin-bottom:18px}
.admin-bar .ledger > .label{top:56px}
.prose{max-width:68ch;display:flex;flex-direction:column;gap:1em}
.prose h1{font-size:var(--step-3);margin-bottom:.4em}
.prose h2{font-size:var(--step-2);margin-top:1em}
.prose a{color:var(--brass)}
.prose ul,.prose ol{margin:0;padding-left:1.2em}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
