/*
Theme Name: House Of Herterr
Theme URI: https://bostonterrier.hr/
Author: House Of Herterr
Description: Custom lightweight theme for House Of Herterr. Initial development build.
Version: 0.1.1
Text Domain: house-of-herterr
*/
:root{
  --ivory:#F5F1E8;
  --paper:#FBF9F4;
  --charcoal:#171614;
  --gold:#B69A62;
  --taupe:#9A9184;
  --line:rgba(23,22,20,.14);
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Manrope", Arial, sans-serif;
  --container:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--charcoal);font-family:var(--sans);line-height:1.65}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}
.site-header{position:relative;z-index:20;background:rgba(251,249,244,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header-inner{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:36px}
.site-brand{display:flex;align-items:center;flex:0 0 auto}.site-brand img{width:250px;height:auto;max-height:78px;object-fit:contain}
.primary-nav ul{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase}
.primary-nav a{transition:color .25s ease}
.primary-nav a:hover{color:var(--gold)}
.hero{min-height:calc(100vh - 92px);display:grid;place-items:center;position:relative;overflow:hidden;background:var(--charcoal);color:#fff}
.hero-media{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.70),rgba(0,0,0,.16)),url('assets/hero-placeholder.svg') center/cover no-repeat;transform:scale(1.015);animation:heroBreath 14s ease-in-out infinite alternate}
.hero-content{position:relative;z-index:1;width:min(calc(100% - 48px),var(--container));padding:110px 0}
.eyebrow{font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:700}
.hero h1{font:600 clamp(4rem,8vw,8.2rem)/.82 var(--serif);max-width:850px;margin:22px 0}
.hero p{max-width:590px;font-size:1.08rem;color:rgba(255,255,255,.82)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 25px;border:1px solid var(--gold);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;margin-top:18px;transition:.25s}
.btn:hover{background:var(--gold);color:var(--charcoal)}
.section{padding:110px 0}
.section-dark{background:var(--charcoal);color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:48px}
.section h2{font:600 clamp(2.8rem,5vw,5.2rem)/.9 var(--serif);margin:0}
.section-intro{max-width:560px;color:var(--taupe)}
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:center}
.about-copy p{font-size:1.05rem}
.about-image{min-height:520px;background:#ddd center/cover no-repeat}
.feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.feature-card{position:relative;min-height:520px;overflow:hidden;background:#222}
.feature-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.feature-card:hover img{transform:scale(1.045)}
.feature-card-content{position:absolute;inset:auto 0 0;padding:38px;background:linear-gradient(transparent,rgba(0,0,0,.82));color:#fff}
.feature-card h3{font:600 3.2rem/1 var(--serif);margin:0 0 8px}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.news-card{border-top:1px solid var(--line);padding-top:18px}
.news-card .thumb{aspect-ratio:4/3;background:#e8e2d7;margin-bottom:20px;overflow:hidden}
.news-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.news-card:hover .thumb img{transform:scale(1.04)}
.news-card h3{font:600 2rem/1.05 var(--serif);margin:10px 0}
.site-footer{background:#11100f;color:#fff;padding:70px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:50px}
.footer-logo{width:210px;margin-bottom:22px}
.footer-title{color:var(--gold);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase}
.footer-links{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px;color:#d9d3c8}
.footer-bottom{margin-top:55px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:.75rem;color:#aaa}
.page-hero{padding:120px 0 80px;background:var(--ivory)}
.page-hero h1{font:600 clamp(3.5rem,7vw,7rem)/.85 var(--serif);margin:0}
.site-main{min-height:60vh}
@media (max-width: 900px){
  .header-inner{min-height:78px}
  .primary-nav ul{gap:14px;font-size:.68rem}
  .site-brand img{width:210px}
  .about-grid,.footer-grid{grid-template-columns:1fr}
  .news-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  .container,.hero-content{width:min(calc(100% - 32px),var(--container))}
  .primary-nav{display:none}
  .hero{min-height:75vh}
  .hero h1{font-size:4rem}
  .section{padding:75px 0}
  .feature-grid,.news-grid{grid-template-columns:1fr}
}

@keyframes heroBreath{from{transform:scale(1.015)}to{transform:scale(1.055)}}
.hero-content > *{animation:revealUp .8s both}
.hero-content h1{animation-delay:.12s}
.hero-content p{animation-delay:.22s}
.hero-content .btn{animation-delay:.32s}
@keyframes revealUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}