:root{
  --container-padding:15px;
  --grid-gap:16px;

  --font-main:'Mazzard', Arial, sans-serif;
  --font-accent:'CormorantGaramond', Georgia, serif;

  --color-bg-main:#F3EFE4;
  --color-bg-card:#FFFCED;

  --color-heading:#766841;
  --color-text:#5F5B52;
  --color-text-soft:rgba(95,91,82,.72);
  --color-text-muted:rgba(95,91,82,.56);

  --color-accent:#997B57;
  --color-accent-dark:#7E6042;

  --color-white:#FFFCED;
  --color-black:#171410;

  --text-primary:var(--color-text);
  --text-secondary:var(--color-text-soft);
  --text-muted:var(--color-text-muted);

  --text-heading:var(--color-heading);
  --text-inverse:var(--color-white);
  --text-inverse-soft:rgba(255,252,237,.82);

  --btn-primary-bg:var(--color-accent);
  --btn-primary-bg-hover:var(--color-accent-dark);
  --btn-primary-text:#FFFCED;

  --btn-outline-bg:transparent;
  --btn-outline-border:rgba(153,123,87,.65);
  --btn-outline-text:var(--color-accent);
  --btn-outline-hover-bg:rgba(153,123,87,.08);

  --btn-light-bg:#FFFCED;
  --btn-light-border:rgba(118,104,65,.14);
  --btn-light-text:var(--color-heading);
  --btn-light-hover:#F8F1DE;

  --btn-arrow-bg:var(--color-accent);
  --btn-arrow-icon:#FFFCED;

  --badge-bg:rgba(255,252,237,.18);
  --badge-border:rgba(255,252,237,.26);
  --badge-text:rgba(255,252,237,.86);
  --badge-accent:var(--color-accent);

  --card-bg:#FFFCED;
  --card-bg-soft:#F3EFE4;
  --card-border:rgba(118,104,65,.12);
  --card-shadow:0 18px 46px rgba(67,52,32,.08);

  --header-text:rgba(255,252,237,.92);
  --header-text-hover:#FFFCED;
  --header-light-bg:rgba(243,239,228,.92);
  --header-light-text:var(--color-heading);
  --header-light-hover:var(--color-accent);

  --radius-sm:14px;
  --radius-md:22px;
  --radius-lg:30px;
  --radius-xl:38px;
  --radius-pill:999px;

  --transition-fast:.2s ease;
  --transition-base:.25s ease;
  --transition-slow:.35s ease;
}

@media (min-width:480px){
  :root{
    --container-padding:30px;
    --grid-gap:20px;
  }
}

@media (min-width:640px){
  :root{
    --container-padding:30px;
    --grid-gap:24px;
  }
}

@media (min-width:960px){
  :root{
    --container-padding:30px;
    --grid-gap:24px;
  }
}

@media (min-width:1200px){
  :root{
    --container-padding:60px;
    --grid-gap:30px;
  }
}

@media (min-width:1920px){
  :root{
    --container-padding:90px;
    --grid-gap:36px;
  }
}

@media (min-width:2560px){
  :root{
    --container-padding:90px;
    --grid-gap:40px;
  }
}

.hv-section-grid{
  width:100%;
  padding-left:var(--container-padding);
  padding-right:var(--container-padding);
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:var(--grid-gap);
  box-sizing:border-box;
}

.hv-section-grid *,
.hv-section-grid *::before,
.hv-section-grid *::after{
  box-sizing:border-box;
}

body{
  font-family:var(--font-main);
  color:var(--text-primary);
  background:var(--color-bg-main);
}

.ty-eyebrow{
  font-family:var(--font-main);
  font-size:14px;
  line-height:1;
  font-weight:400;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ty-hero-title{
  font-family:var(--font-accent);
  font-size:92px;
  line-height:.88;
  font-weight:500;
  letter-spacing:-.045em;
  color:var(--text-heading);
}

.ty-section-title{
  font-family:var(--font-accent);
  font-size:54px;
  line-height:.98;
  font-weight:500;
  letter-spacing:-.035em;
  color:var(--text-heading);
}

.ty-lead{
  font-family:var(--font-main);
  font-size:21px;
  line-height:1.42;
  font-weight:400;
}

.ty-body{
  font-family:var(--font-main);
  font-size:18px;
  line-height:1.62;
  font-weight:400;
}

.ty-card-text{
  font-family:var(--font-main);
  font-size:16px;
  line-height:1.45;
  font-weight:400;
}

.ty-stat{
  font-family:var(--font-accent);
  font-size:68px;
  line-height:.9;
  font-weight:500;
  letter-spacing:-.05em;
  color:var(--text-heading);
}

.ty-button{
  font-family:var(--font-main);
  font-size:17px;
  line-height:1;
  font-weight:400;
}

.hv-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-height:52px;
  padding:0 24px;
  border-radius:var(--radius-pill);
  font-family:var(--font-main);
  font-size:17px;
  line-height:1;
  font-weight:400;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none !important;
  will-change:transform !important;
  transition:
    background var(--transition-base),
    color var(--transition-base),
    border-color var(--transition-base),
    transform var(--transition-base);
}

.hv-btn:hover{
  transform:translateY(-1px);
  box-shadow:none !important;
}

.hv-btn:focus,
.hv-btn:active{
  box-shadow:none !important;
}

.hv-btn--primary{
  background:var(--btn-primary-bg);
  color:var(--btn-primary-text);
  border:1px solid var(--btn-primary-bg);
  box-shadow:none !important;
}

.hv-btn--primary:hover{
  background:var(--btn-primary-bg-hover);
  border-color:var(--btn-primary-bg-hover);
  box-shadow:none !important;
}

.hv-btn--outline{
  background:var(--btn-outline-bg);
  color:var(--btn-outline-text);
  border:1px solid var(--btn-outline-border);
  box-shadow:none !important;
}

.hv-btn--outline:hover{
  background:var(--btn-outline-hover-bg);
  border-color:var(--color-accent);
  box-shadow:none !important;
}

.hv-btn__arrow{
  width:34px;
  height:34px;
  border-radius:50%;
  flex:0 0 34px;
  background:var(--btn-arrow-bg);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform var(--transition-base);
}

.hv-btn__arrow img{
  width:15px;
  height:15px;
  display:block;
  filter:brightness(0) invert(1);
}

.hv-btn:hover .hv-btn__arrow{
  transform:translateX(3px);
}

@media (max-width:479px){
  .ty-eyebrow{font-size:12px;}
  .ty-hero-title{font-size:44px;}
  .ty-section-title{font-size:34px;}
  .ty-lead{font-size:17px;}
  .ty-body{font-size:15px;}
  .ty-card-text{font-size:15px;}
  .ty-stat{font-size:46px;}
  .ty-button{font-size:16px;}
}

@media (min-width:480px) and (max-width:639px){
  .ty-eyebrow{font-size:13px;}
  .ty-hero-title{font-size:54px;}
  .ty-section-title{font-size:40px;}
  .ty-lead{font-size:18px;}
  .ty-body{font-size:16px;}
  .ty-card-text{font-size:16px;}
  .ty-stat{font-size:52px;}
  .ty-button{font-size:16px;}
}

@media (min-width:640px) and (max-width:959px){
  .ty-eyebrow{font-size:14px;}
  .ty-hero-title{font-size:66px;}
  .ty-section-title{font-size:46px;}
  .ty-lead{font-size:19px;}
  .ty-body{font-size:16px;}
  .ty-card-text{font-size:16px;}
  .ty-stat{font-size:58px;}
  .ty-button{font-size:17px;}
}

@media (min-width:960px) and (max-width:1199px){
  .ty-eyebrow{font-size:14px;}
  .ty-hero-title{font-size:76px;}
  .ty-section-title{font-size:48px;}
  .ty-lead{font-size:20px;}
  .ty-body{font-size:17px;}
  .ty-card-text{font-size:16px;}
  .ty-stat{font-size:60px;}
  .ty-button{font-size:17px;}
}

@media (min-width:1200px) and (max-width:1919px){
  .ty-eyebrow{font-size:14px;}
  .ty-hero-title{font-size:92px;}
  .ty-section-title{font-size:54px;}
  .ty-lead{font-size:21px;}
  .ty-body{font-size:18px;}
  .ty-card-text{font-size:18px;}
  .ty-stat{font-size:68px;}
  .ty-button{font-size:17px;}
}

@media (min-width:1920px) and (max-width:2559px){
  .ty-eyebrow{font-size:18px;}
  .ty-hero-title{font-size:122px;}
  .ty-section-title{font-size:66px;}
  .ty-lead{font-size:27px;}
  .ty-body{font-size:21px;}
  .ty-card-text{font-size:21px;}
  .ty-stat{font-size:92px;}
  .ty-button{font-size:22px;}

  .hv-btn{
    min-height:68px;
    padding:0 32px;
    gap:18px;
  }

  .hv-btn__arrow{
    width:42px;
    height:42px;
    flex-basis:42px;
  }

  .hv-btn__arrow img{
    width:18px;
    height:18px;
  }
}

@media (min-width:2560px){
  .ty-eyebrow{font-size:22px;}
  .ty-hero-title{font-size:150px;}
  .ty-section-title{font-size:82px;}
  .ty-lead{font-size:36px;}
  .ty-body{font-size:26px;}
  .ty-card-text{font-size:30px;}
  .ty-stat{font-size:112px;}
  .ty-button{font-size:28px;}

  .hv-btn{
    min-height:86px;
    padding:0 42px;
    gap:22px;
  }

  .hv-btn__arrow{
    width:60px;
    height:60px;
    flex-basis:60px;
  }

  .hv-btn__arrow img{
    width:22px;
    height:22px;
  }
}
</style>