/*
Theme Name: Димитър Вучев
Theme URI: https://vuchev.eu/
Author: Димитър Вучев
Description: Официален сайт на Димитър Вучев.
Version: 12.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
Text Domain: vuchev
*/
:root{--navy:#102646;--deep:#07182f;--blue:#1f67b1;--gold:#d2a64a;--ink:#17243a;--muted:#68758a;--line:#dfe5ed;--max:1200px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font:16px/1.65 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}img,svg{display:block;max-width:100%}a{text-decoration:none;color:inherit}.wrap{width:min(calc(100% - 40px),var(--max));margin:auto}.skip{position:absolute;left:-9999px}header{position:sticky;top:0;z-index:20;background:#fff;box-shadow:0 1px 0 #ddd}.nav{height:88px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.brand b{width:48px;height:48px;display:grid;place-items:center;background:linear-gradient(145deg,var(--blue),var(--navy));color:#fff}.brand strong,.brand small{display:block}.brand strong{font:700 19px Georgia,serif}.brand small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}nav{display:flex;align-items:center;gap:27px;font-size:14px;font-weight:700}nav .cta{padding:11px 18px;background:var(--navy);color:#fff}#menu{display:none;border:0;background:none;font-size:25px}.hero{background:linear-gradient(120deg,#edf3f8,#fff 58%,#e8eff6);border-bottom:7px solid var(--blue)}.hero-grid{min-height:700px;display:grid;grid-template-columns:1fr .72fr;gap:75px;align-items:center;padding:65px 0}.hero h1{margin:0;color:var(--navy);font:700 clamp(64px,8vw,114px)/.83 Georgia,serif;letter-spacing:-.06em}.hero h1 em{font-style:normal;color:var(--blue)}.portrait{margin:0;width:min(100%,430px);aspect-ratio:1023/1537;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:contain;object-position:center top}.section{padding:100px 0}.eyebrow{margin:0 0 12px;color:var(--blue);font-size:12px;letter-spacing:.2em;font-weight:900}h2{margin:0 0 40px;color:var(--navy);font:700 clamp(36px,4vw,56px)/1.05 Georgia,serif}.news{display:grid;grid-template-columns:1.05fr .95fr;max-width:980px;border:1px solid var(--line);box-shadow:0 18px 45px #0b1e3914}.news-image{min-height:340px;position:relative;overflow:hidden;background:var(--navy)}.news-image img{width:100%;height:100%;min-height:340px;object-fit:cover}.news-image:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#07182fcc)}.news-image span{position:absolute;z-index:2;left:25px;bottom:22px;color:#fff;font-size:12px;font-weight:900;letter-spacing:.2em}.news-copy{padding:38px}.meta{color:var(--blue);font-size:12px;font-weight:900;text-transform:uppercase}.news h3{margin:8px 0 15px;color:var(--navy);font:700 32px/1.2 Georgia,serif}.news-copy>p:not(.meta){color:var(--muted)}.news-copy>a{color:var(--blue);font-weight:900}.priorities{background:var(--navy);color:#c4d0df}.priorities h2,.contact h2{color:#fff}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff20}.cards article{position:relative;min-height:330px;padding:40px;background:#132d50}.cards i{position:absolute;right:25px;top:15px;color:#ffffff18;font:60px Georgia,serif}.priority-icon{width:50px;height:50px;color:var(--gold);margin-bottom:24px}.cards h3{color:#fff;font:700 27px Georgia,serif}.bio-text{max-width:1080px}.bio-text h2{margin-bottom:46px}.bio-columns{display:grid;grid-template-columns:1fr 1fr;gap:64px}.bio-columns p,.bio-highlight p{color:#46566d;margin:0 0 22px}.bio-highlight{margin-top:30px;padding:34px 38px;background:#eef3f8;border-top:3px solid var(--blue)}.contact{background:linear-gradient(125deg,var(--deep),var(--navy));color:#fff}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}.form-card{padding:36px;background:#fff;color:var(--ink);box-shadow:0 18px 50px #0003}.form-card h3{margin:0;color:var(--navy);font:700 28px Georgia,serif}.form-card>p{color:var(--muted)}form{display:grid;gap:16px;margin-top:22px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{display:grid;color:var(--navy);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}input,textarea{width:100%;margin-top:6px;padding:12px 13px;border:1px solid #cbd5e1;background:#f8fafc;color:var(--ink);font:16px inherit}.consent{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:9px;color:var(--muted);font-size:12px;font-weight:500;text-transform:none;letter-spacing:0}.consent input{width:17px;height:17px;margin-top:3px}.button{min-height:51px;padding:0 24px;border:0;background:var(--blue);color:#fff;font-size:13px;font-weight:900;text-transform:uppercase;cursor:pointer}.form-card small{display:block;margin-top:17px;color:var(--muted)}#status{display:none;padding:11px;background:#edf4fb;color:var(--navy);font-size:13px}#status.show{display:block}footer{padding:60px 0 25px;background:#061426;color:#aab8ca}.foot{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:60px}.foot>div>a{display:block;margin-top:8px;font-size:14px}.socials{display:flex;gap:12px;margin-top:14px}.socials a{width:42px;height:42px;display:grid;place-items:center;border:1px solid #415069;color:#fff}.socials svg{width:20px;height:20px;fill:currentColor}.socials .unconfirmed{opacity:.55}.copyright{margin-top:45px;padding-top:22px;border-top:1px solid #213049;font-size:12px}@media(max-width:900px){.nav{height:72px}#menu{display:block;min-width:44px;min-height:44px}nav{display:none;position:absolute;left:0;right:0;top:72px;padding:20px;background:#fff;flex-direction:column;align-items:stretch}nav.open{display:flex}.hero-grid,.contact-grid,.bio-columns{grid-template-columns:1fr}.hero-grid{padding:55px 0 85px}.news{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.foot{grid-template-columns:1fr 1fr}}@media(max-width:600px){.wrap{width:calc(100% - 28px)}.brand small{max-width:180px;font-size:9px}.section{padding:70px 0}.hero h1{font-size:62px}.news-image,.news-image img{min-height:220px}.news-copy{padding:25px}.news h3{font-size:26px}.form-row{grid-template-columns:1fr}.foot{grid-template-columns:1fr}.cards article{min-height:270px}.bio-highlight{padding:25px}}

/* Social links inspired by the compact icon treatment on radankanev.eu */
.header-right{display:flex;flex-direction:column;align-items:flex-end;gap:9px}
.top-socials,.footer-socials{display:flex;align-items:center;gap:8px}
.top-socials a{width:30px;height:30px;display:grid;place-items:center;color:var(--navy);border:1px solid transparent;transition:.2s ease}
.top-socials a:hover{color:var(--blue);border-color:var(--line)}
.top-socials svg{width:16px;height:16px;fill:currentColor}
.header-right nav{display:flex}
.footer-bar{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid #213049}
.footer-socials a{width:38px;height:38px;display:grid;place-items:center;border:1px solid #415069;color:#fff;transition:.2s ease}
.footer-socials a:hover{border-color:#8ea4bf;color:#fff}
.footer-socials svg{width:18px;height:18px;fill:currentColor}
.footer-bar .copyright{margin:0;padding:0;border:0;font-size:12px;color:#aab8ca}
@media(max-width:900px){
.header-right{flex-direction:row;align-items:center;gap:12px}
.top-socials{order:0}
.header-right nav{display:none;position:absolute;left:0;right:0;top:72px;padding:20px;background:#fff;flex-direction:column;align-items:stretch}
.header-right nav.open{display:flex}
.footer-bar{padding:20px 0;flex-direction:column;align-items:flex-start}
}
@media(max-width:600px){
.top-socials{gap:3px}
.top-socials a{width:27px;height:27px}
.top-socials svg{width:15px;height:15px}
.footer-bar{align-items:center;text-align:center}
.footer-socials{justify-content:center}
.footer-bar .copyright{line-height:1.5}
}

/* v10: corrected LinkedIn icon and email removed from social rows */
.top-socials svg, .footer-socials svg{
  display:block;
  width:18px;
  height:18px;
  fill:currentColor;
}
.top-socials a{display:grid;place-items:center}
.footer-socials a{display:grid;place-items:center}

/* v11: LinkedIn brand mark */
.linkedin-icon{
  display:block !important;
  width:18px !important;
  height:18px !important;
}
.linkedin-icon rect{fill:currentColor}
.linkedin-icon path{fill:#fff}

/* v12: LinkedIn icon supplied by the site owner */
.top-socials .linkedin-icon-img,
.footer-socials .linkedin-icon-img{
  display:block !important;
  width:18px !important;
  height:18px !important;
  max-width:none !important;
  object-fit:contain;
}

/* v13 */
.linkedin-logo{
  display:block !important;
  width:18px !important;
  height:18px !important;
  object-fit:contain;
  filter: grayscale(1) brightness(0) saturate(100%);
  opacity:.72;
}
.top-socials a:hover .linkedin-logo,
.footer-socials a:hover .linkedin-logo{opacity:1}
.youtube-icon{
  display:block !important;
  width:18px !important;
  height:18px !important;
  fill:currentColor !important;
}

/* v14: LinkedIn derived from the supplied logo, transparent and monochrome */
.linkedin-logo{
  display:block !important;
  width:18px !important;
  height:18px !important;
  max-width:none !important;
  object-fit:contain;
  filter:none !important;
  opacity:1 !important;
}
.footer-socials .linkedin-logo{
  filter:brightness(0) invert(1) !important;
}
.top-socials .linkedin-logo{filter:none !important}

/* v15: social icons alignment and LinkedIn sizing */
.top-socials{
  justify-content:center;
  width:100%;
}
.top-socials .linkedin-logo,
.footer-socials .linkedin-logo{
  width:18px !important;
  height:18px !important;
  max-width:18px !important;
  max-height:18px !important;
  object-fit:contain;
}
.top-socials a,
.footer-socials a{
  display:grid;
  place-items:center;
}

/* Keep the social row centered directly above the contact button. */
.header-right{
  align-items:center;
}
.header-right nav{
  justify-content:center;
}

/* v16: social icons appear only in the footer */
.header-right{display:flex;align-items:center;justify-content:flex-end}
.header-right nav{display:flex;justify-content:center}
.top-socials{display:none !important}
@media(max-width:900px){.header-right{display:flex;align-items:center}.header-right nav{display:none}.header-right nav.open{display:flex}}

/* v17 LinkedIn sizing */
.footer-socials .linkedin-logo {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
}
.footer-socials a {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
}

/* v18: final LinkedIn sizing */
.footer-socials .linkedin-logo {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  filter: none !important;
  opacity: 1 !important;
}
.footer-socials a {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
}

/* v19: LinkedIn mark rendered in CSS so it is always visible */
.footer-socials .linkedin-mark{
  position:relative !important;
  display:block !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  color:currentColor !important;
  flex:none !important;
}
.footer-socials .linkedin-dot{
  position:absolute;
  left:1px;
  top:0;
  width:4px;
  height:4px;
  border-radius:50%;
  background:currentColor;
}
.footer-socials .linkedin-i{
  position:absolute;
  left:1px;
  top:6px;
  width:4px;
  height:12px;
  background:currentColor;
}
.footer-socials .linkedin-n{
  position:absolute;
  left:7px;
  top:6px;
  width:10px;
  height:12px;
  border-left:4px solid currentColor;
  border-top:4px solid currentColor;
  border-radius:3px 3px 0 0;
  box-sizing:border-box;
}
.footer-socials .linkedin-n:after{
  content:"";
  position:absolute;
  left:2px;
  top:-4px;
  width:7px;
  height:12px;
  border-right:4px solid currentColor;
  border-bottom:4px solid currentColor;
  border-radius:0 3px 0 0;
}

/* v20: LinkedIn reliable mark + slightly smaller mobile site title */
.footer-socials .linkedin-mark{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  color:currentColor !important;
  font-family:Arial, Helvetica, sans-serif !important;
  font-size:17px !important;
  line-height:18px !important;
  font-weight:800 !important;
  letter-spacing:-1.1px !important;
  text-decoration:none !important;
  transform:translateY(1px);
}
@media (max-width: 600px){
  .brand span strong{
    font-size:20px !important;
  }
}

/* v21: biography typography */
#bio,
#bio p,
#bio .bio-content,
#bio .bio-text{
  text-align: center !important;
}
#bio p{
  font-weight: 700 !important;
  text-align: center !important;
}

/* v22: biography text justified on desktop and mobile, normal weight */
#bio p,
#bio .bio-text{
  text-align: justify !important;
  font-weight: 400 !important;
}
@media (max-width: 900px){
  #bio p,
  #bio .bio-text{
    text-align: justify !important;
    font-weight: 400 !important;
  }
}

/* v23: clean biography layout */
#bio .bio-text,
#bio p.bio-text {
  display: block !important;
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto 18px auto !important;
  padding: 0 !important;
  text-align: justify !important;
  text-align-last: left !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  box-sizing: border-box !important;
}
#bio .bio-text:last-child {
  margin-bottom: 0 !important;
}
@media (max-width: 900px) {
  #bio .bio-text,
  #bio p.bio-text {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: justify !important;
    text-align-last: left !important;
    line-height: 1.65 !important;
  }
}

/* v24: more comfortable side spacing for biography on phones */
@media (max-width: 600px){
  #bio .bio-text,
  #bio p.bio-text{
    width: auto !important;
    max-width: none !important;
    margin-left: 14px !important;
    margin-right: 14px !important;
  }
}

/* v25: working WordPress contact form */
.contact-form label{display:block;margin-bottom:16px;font-weight:600}
.contact-form input,.contact-form textarea{width:100%;box-sizing:border-box;margin-top:7px;padding:12px 14px;border:1px solid #cfd6df;border-radius:4px;font:inherit;background:#fff}
.contact-form textarea{resize:vertical;min-height:140px}
.contact-form button{border:0;cursor:pointer}
.contact-notice{margin:0 0 18px;padding:12px 14px;border:1px solid #cfd6df}
.contact-notice.success{background:#f3f8f3}
.contact-notice.error{background:#fff5f5}


/* Contact form submit button */
.contact-form button[type="submit"],
.contact-form input[type="submit"] {
  display: inline-block;
  background: #0b63ce;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 14px 30px;
  min-height: 52px;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  transition: background .2s ease, transform .1s ease;
}
.contact-form button[type="submit"]:hover,
.contact-form input[type="submit"]:hover {
  background: #084fa8;
}
.contact-form button[type="submit"]:active,
.contact-form input[type="submit"]:active {
  transform: translateY(1px);
}

/* Mobile spacing fix v28 */

@media (max-width: 600px) {
  .about-section {
    margin-bottom: 20px !important;
  }
  .about-section + .bio-section,
  .about-section + section {
    margin-top: 0 !important;
  }
  .bio-section {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}


/* v30: remove only the blue accent bar under "За мен" */
.about-section::after {
  display: none !important;
}


/* v31: remove blue bar/divider around the "За мен" heading */
.about-section::before,
.about-section::after,
.about-section .section-divider,
.about-section .section-bar,
.about-section .blue-bar,
.about-section .accent-bar,
.bio-section + .about-section::before {
  display: none !important;
  content: none !important;
  border: 0 !important;
  background: none !important;
  height: 0 !important;
}


/* v33: biography typography and sizing */
.bio-section p,
.biography p,
.about-section p {
  text-align: justify;
  font-weight: 400;
  line-height: 1.7;
  font-size: 17px;
}

@media (max-width: 600px) {
  .bio-section p,
  .biography p,
  .about-section p {
    text-align: justify;
    font-size: 16px;
    line-height: 1.65;
  }
}


/* v34: restore centered biography layout */
.bio-section,
.biography,
.about-section {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.bio-section p,
.biography p,
.about-section p {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  text-align: justify;
  font-weight: 400;
  line-height: 1.7;
  font-size: 17px;
}

@media (max-width: 600px) {
  .bio-section,
  .biography,
  .about-section {
    width: auto;
    max-width: none;
    margin-left: 14px;
    margin-right: 14px;
  }

  .bio-section p,
  .biography p,
  .about-section p {
    max-width: none;
    text-align: justify;
    font-size: 16px;
    line-height: 1.65;
  }
}

/* v36: fix biography structure and spacing */
.biography .bio-text {
  width: min(calc(100% - 40px), 1080px);
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

.biography .bio-text h2 {
  margin-bottom: 28px;
}

.biography .bio-text p {
  max-width: 900px;
  margin: 0 auto 22px;
  text-align: justify;
  text-align-last: left;
  font-weight: 400;
  line-height: 1.7;
  font-size: 17px;
}

.biography .bio-text p:last-child {
  margin-bottom: 0;
}

@media (max-width: 600px) {
  .biography .bio-text {
    width: calc(100% - 28px);
    max-width: none;
  }

  .biography .bio-text h2 {
    margin-bottom: 22px;
  }

  .biography .bio-text p {
    max-width: none;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.65;
  }
}

/* v45 Blog */
.blog .wrap{width:min(calc(100% - 40px),1080px);margin:auto}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.blog-card{border:1px solid #e5e7eb;border-radius:8px;background:#fff;box-shadow:0 5px 18px rgba(0,0,0,.05);overflow:hidden}
.blog-card-content{padding:24px}.blog-date{font-size:13px;color:#6b7280;margin-bottom:8px}
.blog-card h3{margin:0 0 12px;font-size:21px;line-height:1.3}.blog-card h3 a{color:inherit;text-decoration:none}
.blog-card h3 a:hover{color:#0b63ce}.blog-card p{margin:0 0 18px;line-height:1.6}
.blog-read-more{color:#0b63ce;font-size:14px;font-weight:700;text-decoration:none}.blog-read-more:hover{text-decoration:underline}
.blog-empty{grid-column:1/-1}
@media(max-width:600px){.blog .wrap{width:calc(100% - 28px)}.blog-grid{grid-template-columns:1fr;gap:18px}.blog-card-content{padding:20px}}

/* v46: navigation without Priorities */

/* v47: align Blog heading with the biography text column */
.blog {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.blog .wrap {
  width: min(calc(100% - 40px), 900px);
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.blog h2 {
  margin-top: 0 !important;
}
@media (max-width: 600px) {
  .blog .wrap {
    width: calc(100% - 28px);
    max-width: none;
  }
}

/* v48: restore large hero portrait */
.portrait {
  width: min(100%, 540px) !important;
}
@media (max-width: 900px) {
  .portrait {
    width: min(100%, 500px) !important;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 600px) {
  .portrait {
    width: min(100%, 100%) !important;
  }
}

/* v49: restore the portrait to the large hero presentation */
.hero .portrait,
.hero img.portrait,
.hero-image .portrait,
.hero-photo .portrait {
  width: 620px !important;
  max-width: 100% !important;
  height: auto !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 900px) {
  .hero .portrait,
  .hero img.portrait,
  .hero-image .portrait,
  .hero-photo .portrait {
    width: 520px !important;
    max-width: 100% !important;
  }
}

@media (max-width: 600px) {
  .hero .portrait,
  .hero img.portrait,
  .hero-image .portrait,
  .hero-photo .portrait {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* v50: slightly reduce hero portrait size */
.hero .portrait,
.hero img.portrait,
.hero-image .portrait,
.hero-photo .portrait {
  width: 560px !important;
  max-width: 100% !important;
}
@media (max-width: 900px) {
  .hero .portrait,
  .hero img.portrait,
  .hero-image .portrait,
  .hero-photo .portrait {
    width: 470px !important;
  }
}
@media (max-width: 600px) {
  .hero .portrait,
  .hero img.portrait,
  .hero-image .portrait,
  .hero-photo .portrait {
    width: 100% !important;
  }
}

/* v51: center hero portrait and place the name beside it on two lines */
.hero-grid {
  align-items: center !important;
}

.hero-grid > * {
  align-self: center;
}

.hero-grid .portrait {
  justify-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.hero h1 {
  text-align: left;
  line-height: .92;
}

@media (min-width: 901px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 70px;
  }
  .hero-copy {
    justify-self: end;
  }
  .hero-grid .portrait {
    justify-self: start !important;
  }
}

@media (max-width: 900px) {
  .hero-grid {
    grid-template-columns: 1fr !important;
  }
  .hero-copy {
    order: 1;
    justify-self: center;
    text-align: center;
  }
  .hero-grid .portrait {
    order: 2;
    justify-self: center !important;
  }
  .hero h1 {
    text-align: center;
  }
}

/* v52: restore blue accent on "Вучев" */
.hero h1 .name-accent {
  color: #1769c2 !important;
}

/* v53: slightly reduce hero name size */
.hero h1 {
  font-size: 54px !important;
}
@media (max-width: 900px) {
  .hero h1 {
    font-size: 48px !important;
  }
}
@media (max-width: 600px) {
  .hero h1 {
    font-size: 38px !important;
  }
}

/* v54: balanced hero layout based on the requested reference */
.hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr) !important;
  align-items: center !important;
  gap: 70px !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.hero-copy {
  justify-self: end !important;
  width: 100%;
  min-width: 0;
}

.hero h1 {
  font-size: 58px !important;
  line-height: 0.92 !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.hero h1 .name-accent {
  color: #1769c2 !important;
}

.hero-grid .portrait {
  justify-self: center !important;
  width: 470px !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1100px) and (min-width: 901px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.7fr) !important;
    gap: 45px !important;
    padding-left: 30px;
    padding-right: 30px;
  }
  .hero h1 {
    font-size: 50px !important;
  }
  .hero-grid .portrait {
    width: 410px !important;
  }
}

@media (max-width: 900px) {
  .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    max-width: 700px !important;
  }
  .hero-copy {
    justify-self: center !important;
    text-align: center;
  }
  .hero h1 {
    font-size: 48px !important;
    white-space: normal !important;
    text-align: center;
  }
  .hero-grid .portrait {
    width: 470px !important;
    justify-self: center !important;
  }
}

@media (max-width: 600px) {
  .hero-grid {
    width: calc(100% - 28px) !important;
    padding: 35px 0 55px !important;
  }
  .hero h1 {
    font-size: 38px !important;
  }
  .hero-grid .portrait {
    width: 100% !important;
  }
}

/* v55: enlarge hero name to match the requested reference */
.hero h1 {
  font-size: 78px !important;
  line-height: 0.9 !important;
}
@media (max-width: 1100px) and (min-width: 901px) {
  .hero h1 {
    font-size: 68px !important;
  }
}
@media (max-width: 900px) {
  .hero h1 {
    font-size: 58px !important;
    line-height: 0.92 !important;
  }
}
@media (max-width: 600px) {
  .hero h1 {
    font-size: 46px !important;
    line-height: 0.92 !important;
  }
}