/*
Theme Name: The Human Behind Success
Description: Editorial theme for thehumanbehindsuccess.co.uk. Markup lifted from the original design, rendered server-side.
Version: 1.0
*/
/* latin-ext */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("fonts/06a20e69.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("fonts/3826d273.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/06a20e69.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/3826d273.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/06a20e69.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/3826d273.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/06a20e69.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/3826d273.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 200 500;
  font-display: swap;
  src: url("fonts/36b7f80c.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 200 500;
  font-display: swap;
  src: url("fonts/b7f93b8c.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 200 500;
  font-display: swap;
  src: url("fonts/c9575c6f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 600;
  font-display: swap;
  src: url("fonts/a37f49a9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 600;
  font-display: swap;
  src: url("fonts/d9a200b5.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 600;
  font-display: swap;
  src: url("fonts/8c00ce3b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


  html { scroll-behavior: smooth; }
  body { margin: 0; background: #FBF9F5; color: #2A2E26; font-family: Karla, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
  * { box-sizing: border-box; }
  a { color: #5F6B4F; text-decoration: none; }
  a:hover { color: #2A2E26; }
  ::selection { background: #DED3C4; }
  [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); }
  [data-reveal].om-in { opacity: 1; transform: none; }
  input, textarea, button { font-family: inherit; }
  input:focus, textarea:focus { outline: none; border-color: #7C7F63 !important; }

/* the reveal transition itself comes from the design's own base layer above;
   only the reduced-motion guard is added here. */
@media (prefers-reduced-motion: reduce){[data-reveal]{opacity:1;transform:none;transition:none}}
img{max-width:100%;height:auto}
.thbs-prose p{margin:0 0 26px}
.thbs-prose blockquote{margin:38px 0;padding-left:26px;border-left:2px solid #C9BFB0;font-family:Newsreader,serif;font-style:italic;font-size:21px;line-height:1.5;color:#55584E}
.thbs-prose blockquote p{margin:0 0 12px}
.thbs-prose h2{margin:46px 0 16px;font-family:Newsreader,serif;font-weight:300;font-size:clamp(1.8rem,3vw,2.4rem);line-height:1.12;letter-spacing:-.02em;color:#2A2E26}
.thbs-prose h3{margin:38px 0 14px;font-family:Newsreader,serif;font-weight:400;font-size:1.5rem;color:#2A2E26}
.thbs-prose ul,.thbs-prose ol{margin:0 0 26px 1.2em}
.thbs-prose li{margin:0 0 10px}
.thbs-prose a{color:#5F6B4F;text-decoration:underline;text-underline-offset:3px}
.thbs-prose img{margin:34px 0;border-radius:3px}
.thbs-prose figcaption{margin-top:-22px;font-size:14px;color:#706B63}
/* Block-editor output has to land inside this design, not WordPress's defaults.
   Without these, a Button block renders in WP grey (#32373c) and a Quote block
   loses the hairline. Lina writes in the editor, so this is the writer's surface. */
.thbs-prose .wp-block-quote{margin:38px 0;padding-left:26px;border-left:2px solid #C9BFB0;font-family:Newsreader,serif;font-style:italic;font-size:21px;line-height:1.5;color:#55584E}
.thbs-prose .wp-block-quote cite{display:block;margin-top:12px;font-style:normal;font-size:14px;color:#706B63}
.thbs-prose .wp-block-pullquote{margin:44px 0;padding:32px;background:#F2EEE5;border:none;text-align:left}
.thbs-prose figure.wp-block-image{margin:34px 0}
.thbs-prose figure.wp-block-image figcaption{margin-top:12px;text-align:left}
.thbs-prose .wp-element-button,.thbs-prose .wp-block-button__link{display:inline-flex;align-items:center;gap:12px;padding:14px 28px;border:1px solid #B8AB9C;border-radius:999px;background:transparent;color:#2F3429;font-size:13px;letter-spacing:.09em;text-transform:uppercase;font-weight:500;text-decoration:none}
.thbs-prose .wp-element-button:hover,.thbs-prose .wp-block-button__link:hover{background:#F0EBE2;border-color:#7C7F63}
.thbs-prose .wp-block-separator{margin:44px 0;border:none;border-top:1px solid #E6E0D6}
.thbs-prose .wp-block-table td,.thbs-prose .wp-block-table th{padding:10px 14px;border-bottom:1px solid #E6E0D6;font-size:16px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.pagination .nav-links{display:flex;gap:12px;flex-wrap:wrap}
.pagination .page-numbers{color:#706B63;padding:4px 12px;border-radius:999px}
.pagination .page-numbers.current{color:#2A2E26;background:#F0EBE2}
:focus-visible{outline:2px solid #5F6B4F;outline-offset:3px}
/* The design's own rule is `input:focus{outline:none}`, which outranks a bare
   :focus-visible. Matching its specificity puts a real ring back for keyboards
   without showing one on mouse clicks. */
input:focus-visible,textarea:focus-visible,button:focus-visible{outline:2px solid #5F6B4F;outline-offset:2px}
::placeholder{color:#706B63;opacity:1}
.thbs-skip{position:absolute;left:-9999px;top:0;z-index:100;background:#2A2E26;color:#FBF9F5;padding:12px 20px;font-size:14px}
.thbs-skip:focus{left:0}
.hv1:hover{color: #2A2E26;}
.hv2:hover{color: #FFFFFF;}
.hv3:hover{background: #4A5140;}
.hv4:hover{color: #5F6B4F;}
.hv5:hover{background: #F0EBE2; border-color: #7C7F63;}
.hv6:hover{background: #F2EDE4;}
.hv7:hover{background: #E9E3D6;}
.hv8:hover{color: #7C7F63;}
.hv9:hover{background: #E8E2D6; border-color: #7C7F63;}