/*
Theme Name: Style House
Theme URI: https://example.com/
Author: Custom Theme
Description: A refined, responsive WordPress theme inspired by the supplied Style House screenshot. Built as a lightweight classic theme with editable Customizer content.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: style-house
*/

:root{
  --ink:#252525;
  --muted:#66625e;
  --cream:#f5f1e8;
  --cream-2:#eee8dc;
  --gold:#c9b08b;
  --gold-dark:#ad9167;
  --white:#fff;
  --max:1180px;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Montserrat", Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#fff;font-family:var(--sans);font-size:15px;line-height:1.7}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.container{width:min(var(--max),calc(100% - 60px));margin:auto}
.site-header{background:#fff;position:relative;z-index:20;border-bottom:1px solid rgba(0,0,0,.04)}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.site-brand{display:flex;align-items:center;gap:15px;min-width:220px}
.custom-logo{max-height:58px;width:auto}
.brand-text{line-height:1}
.brand-name{font-family:var(--serif);font-size:38px;letter-spacing:.5px}
.brand-tag{font-size:8px;letter-spacing:2.3px;text-transform:uppercase;margin-top:4px;color:#555}
.primary-nav ul{list-style:none;display:flex;align-items:center;gap:30px;margin:0;padding:0}
.primary-nav a{font-size:11px;letter-spacing:1px;text-transform:uppercase}
.primary-nav a:hover,.primary-nav .current-menu-item>a{color:var(--gold-dark)}
.header-cta{background:var(--ink);color:#fff;padding:16px 26px;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap}
.menu-toggle{display:none;border:0;background:none;font-size:24px}
.hero{min-height:495px;display:flex;background:#f6f2eb}
.hero-copy{width:43%;display:flex;align-items:center;padding:65px 0 65px max(30px,calc((100vw - var(--max))/2))}
.hero-content{max-width:500px;padding-right:35px}
.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#555;margin:0 0 22px}
.hero h1{font-family:var(--serif);font-size:64px;line-height:.96;font-weight:400;margin:0 0 28px}
.hero h1 em{display:block;font-style:italic}
.gold-line{width:44px;height:2px;background:var(--gold);margin:0 0 22px}
.hero-lead{font-size:13px;letter-spacing:1.7px;text-transform:uppercase;font-weight:500}
.hero p{color:#5c5a57;font-size:14px;line-height:1.8}
.btn{display:inline-flex;align-items:center;gap:25px;background:var(--ink);color:#fff;padding:15px 25px;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;margin-top:15px;transition:.2s}
.btn:hover{background:#444}
.btn .arrow{font-size:18px;line-height:0}
.hero-image{width:57%;background-position:center;background-size:cover;min-height:495px}
.section{padding:58px 0}
.section-heading{text-align:center;margin-bottom:27px}
.section-heading h2{font-family:var(--serif);font-size:34px;font-weight:400;margin:0}
.section-heading p{margin:3px 0 0;color:#666;font-size:13px}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.service-card{text-align:center}
.service-image{height:205px;background-size:cover;background-position:center}
.service-icon{width:70px;height:70px;border-radius:50%;background:#fff;border:1px solid var(--gold);display:grid;place-items:center;margin:-35px auto 5px;position:relative;color:var(--gold);font-size:27px}
.service-card h3{font-size:13px;letter-spacing:1.8px;font-weight:500;margin:7px 0 12px}
.service-card p{max-width:290px;margin:0 auto;color:#666;font-size:13px;line-height:1.7}
.text-link{display:inline-block;margin-top:15px;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold-dark)}
.text-link span{font-size:17px;margin-left:10px}
.why{background:var(--cream)}
.why-grid{display:grid;grid-template-columns:1.05fr 1.95fr;gap:55px;align-items:center}
.why-copy{border-right:1px solid #d9d1c4;padding-right:45px}
.why-copy h2{font-family:var(--serif);font-weight:400;font-size:39px;line-height:1.05;margin:8px 0 12px}
.why-copy p{font-size:13px;color:#666}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
.feature{text-align:center}
.feature-icon{width:70px;height:70px;border-radius:50%;background:#fff;display:grid;place-items:center;margin:0 auto 12px;color:var(--gold);font-size:28px}
.feature h3{font-size:11px;line-height:1.25;letter-spacing:1.4px;text-transform:uppercase;margin:0 0 8px}
.feature p{font-size:12px;color:#666;line-height:1.6;margin:0}
.cta-band{background:var(--ink);color:#fff}
.cta-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:155px}
.cta-copy .eyebrow{color:var(--gold);margin-bottom:3px}
.cta-copy h2{font-family:var(--serif);font-size:31px;font-weight:400;margin:0 0 2px}
.cta-copy p{font-size:12px;color:#ccc;margin:0}
.cta-details{display:flex;justify-content:flex-end;gap:35px;align-items:center}
.contact-list{display:grid;gap:9px;font-size:12px;color:#ddd}
.contact-list span:first-child{color:var(--gold);margin-right:10px}
.site-footer{background:#fff;text-align:center;padding:12px 0 18px}
.footer-brand{font-family:var(--serif);font-size:25px;line-height:1}
.footer-tag{font-size:7px;letter-spacing:2px;color:#666}
.socials{margin-top:7px;display:flex;justify-content:center;gap:14px;font-size:18px}
.page-hero{background:var(--cream);padding:75px 0;text-align:center}
.page-hero h1{font-family:var(--serif);font-weight:400;font-size:54px;margin:0}
.content-area{padding:65px 0}
.entry-content{max-width:820px;margin:auto}
.entry-content h2,.entry-content h3{font-family:var(--serif);font-weight:400}
.entry-content img{margin:25px 0}
@media(max-width:1050px){
  .primary-nav ul{gap:16px}
  .header-cta{padding:13px 18px}
  .hero h1{font-size:54px}
}
@media(max-width:800px){
  .container{width:min(var(--max),calc(100% - 34px))}
  .header-inner{min-height:72px}
  .primary-nav{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;border-top:1px solid #eee;padding:15px 20px}
  .primary-nav.open{display:block}
  .primary-nav ul{display:grid;gap:0}
  .primary-nav li a{display:block;padding:12px 0}
  .menu-toggle{display:block}
  .header-cta{display:none}
  .brand-name{font-size:31px}
  .hero{display:block}
  .hero-copy{width:100%;padding:45px 0}
  .hero-content{padding-right:0}
  .hero h1{font-size:51px}
  .hero-image{width:100%;min-height:330px}
  .services-grid{grid-template-columns:1fr;gap:45px}
  .service-image{height:240px}
  .why-grid{grid-template-columns:1fr;gap:35px}
  .why-copy{border-right:0;border-bottom:1px solid #d9d1c4;padding:0 0 30px}
  .features{grid-template-columns:1fr 1fr;gap:30px 15px}
  .cta-inner{grid-template-columns:1fr;gap:20px;padding:35px 0}
  .cta-details{justify-content:flex-start}
}
@media(max-width:480px){
  .hero h1{font-size:44px}
  .features{grid-template-columns:1fr 1fr}
  .feature-icon{width:60px;height:60px}
}
