/*
Theme Name: Anabela One Page Bridal
Theme URI: https://anabelaweddinghairandmakeup.com/
Author: OpenAI for Anabela Wedding Hair & Makeup
Description: Elegant, mobile-first one-page WordPress theme for Anabela Wedding Hair & Makeup.
Version: 1.0.0
Text Domain: anabela-onepage
*/

:root{
  --ink:#302b29;
  --muted:#716866;
  --paper:#fbf8f4;
  --white:#fff;
  --blush:#b77c71;
  --blush-deep:#9b665d;
  --line:#eadfd9;
  --soft:#f3ebe6;
  --serif: Georgia, "Times New Roman", serif;
  --sans: -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}
img{display:block;width:100%;height:auto}
a{color:inherit}
.site-wrap{max-width:1440px;margin:0 auto;background:var(--white);box-shadow:0 10px 50px rgba(50,35,30,.08)}
.container{width:min(1160px,calc(100% - 44px));margin:auto}
.eyebrow{font-size:.72rem;letter-spacing:.20em;text-transform:uppercase;color:var(--blush-deep);font-weight:700}
h1,h2,h3,.brand{font-family:var(--serif);font-weight:400;line-height:1.05}
h1{font-size:clamp(2.7rem,5vw,5.2rem);margin:.15em 0 .28em}
h2{font-size:clamp(2rem,3.2vw,3.7rem);margin:.1em 0 .35em}
h3{font-size:clamp(1.35rem,2vw,2rem)}
p{margin:.35rem 0 1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border:1px solid var(--blush);text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;transition:.2s ease;background:transparent}
.btn:hover{transform:translateY(-1px);background:var(--soft)}
.btn-primary{background:var(--blush);color:white;border-color:var(--blush)}
.btn-primary:hover{background:var(--blush-deep)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

.site-header{height:76px;display:flex;align-items:center;background:rgba(255,255,255,.96);position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(234,223,217,.75)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:26px}
.brand{text-decoration:none;font-size:1.55rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.brand small{display:block;font-family:var(--sans);font-size:.48rem;letter-spacing:.25em;text-align:center;margin-top:3px}
.jump-nav{display:flex;align-items:center;gap:28px}
.jump-nav a{text-decoration:none;text-transform:uppercase;letter-spacing:.11em;font-size:.69rem}
.jump-nav .header-cta{padding:10px 18px;background:var(--blush);color:#fff;border-radius:2px}

.hero{display:grid;grid-template-columns:.43fr .57fr;min-height:650px;background:linear-gradient(90deg,#f8f2ec,#fff)}
.hero-copy{padding:clamp(48px,7vw,100px);padding-right:40px;display:flex;justify-content:center;flex-direction:column}
.hero-copy .sub{max-width:440px;font-size:1.05rem;color:#554b48}
.locations{font-size:.72rem;font-weight:650;letter-spacing:.10em;text-transform:uppercase;margin-top:12px}
.hero-image{min-height:650px;background-position:center 26%;background-size:cover}

.about{padding:86px 0 40px}
.about-grid{display:grid;grid-template-columns:.76fr 1.3fr .9fr;gap:36px;align-items:center}
.about-photo{aspect-ratio:4/5;object-fit:cover}
.about-copy p{max-width:610px}
.service-list{border-left:1px solid var(--line);padding-left:30px;display:grid;gap:16px}
.service-item{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;font-size:.92rem}
.service-icon{color:var(--blush);font-size:1.25rem}

.gallery{padding:28px 0 76px}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gallery-grid figure{margin:0;overflow:hidden;background:#eee;aspect-ratio:4/5}
.gallery-grid img{height:100%;object-fit:cover;transition:transform .5s ease}
.gallery-grid figure:hover img{transform:scale(1.025)}
.gallery-caption{text-align:center;padding:34px 12px 0}
.gallery-caption h3{font-family:var(--sans);font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;margin:0 0 12px}
.gallery-caption p{max-width:850px;margin:auto;color:var(--muted)}

.trial{padding:74px 0;background:var(--soft)}
.trial-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:64px;align-items:center}
.trial-image{aspect-ratio:16/10;object-fit:cover}
.trial-copy p{max-width:520px}

.reviews{padding:88px 0 74px;text-align:center}
.quote-mark{font-family:var(--serif);font-size:5rem;color:#c8a097;height:48px;line-height:1}
blockquote{margin:12px auto;max-width:790px}
blockquote p{font-family:var(--serif);font-size:clamp(1.25rem,2vw,1.75rem);line-height:1.5}
cite{font-style:normal;text-transform:uppercase;letter-spacing:.15em;font-size:.72rem}

.contact{padding:80px 0;background:linear-gradient(180deg,#f8f1ed,#fff)}
.contact-head{text-align:center;max-width:780px;margin:0 auto 38px}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:start}
.contact-panel{background:white;padding:32px;border:1px solid var(--line)}
.contact-details{display:grid;gap:18px}
.contact-detail b{display:block;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:var(--blush-deep)}
.contact-detail a{text-decoration:none;font-size:1.05rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}
input,textarea{width:100%;padding:13px 14px;border:1px solid #d9cbc5;background:#fff;font:inherit;border-radius:0}
textarea{min-height:130px;resize:vertical}
button.btn{cursor:pointer}
.notice{padding:12px 14px;margin-bottom:16px;background:#edf7ee;border:1px solid #cfe8d0}
.notice.error{background:#fff0ef;border-color:#efcbc7}

.site-footer{text-align:center;padding:34px 20px 110px;color:#786e6b;font-size:.75rem;letter-spacing:.08em}
.site-footer .brand{font-size:1.25rem;color:var(--ink);display:inline-block;margin-bottom:12px}
.mobile-contact{display:none}

@media (max-width:900px){
  .site-wrap{box-shadow:none}
  .site-header{height:72px;position:relative}
  .header-inner{justify-content:center}
  .jump-nav{display:none}
  .brand{font-size:1.35rem}
  .hero{display:block;min-height:0}
  .hero-image{height:56vh;min-height:430px;background-position:center 20%;order:-1}
  .hero{display:flex;flex-direction:column}
  .hero-copy{padding:34px 26px 44px}
  h1{font-size:clamp(2.55rem,12vw,4rem)}
  .hero-copy .sub{font-size:.96rem}
  .btn-row .btn{flex:1 1 100%}
  .locations{text-align:center;margin-top:18px}
  .about{padding:55px 0 22px}
  .about-grid{grid-template-columns:1fr;gap:24px}
  .about-photo{max-width:520px;margin:auto}
  .service-list{border-left:0;border-top:1px solid var(--line);padding:24px 0 0}
  .gallery-grid{grid-template-columns:1fr 1fr;gap:7px}
  .gallery{padding-bottom:54px}
  .trial{padding:54px 0}
  .trial-grid{grid-template-columns:1fr;gap:28px}
  .trial-image{order:-1}
  .reviews{padding:62px 0}
  .contact{padding:58px 0}
  .contact-grid{grid-template-columns:1fr;gap:22px}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .site-footer{padding-bottom:94px}
  .mobile-contact{
    position:fixed;display:grid;grid-template-columns:repeat(3,1fr);bottom:0;left:0;right:0;z-index:99;
    background:var(--blush-deep);color:white;box-shadow:0 -5px 24px rgba(0,0,0,.15)
  }
  .mobile-contact a{padding:11px 4px 9px;text-decoration:none;text-align:center;font-size:.72rem}
  .mobile-contact span{display:block;font-size:1.2rem;line-height:1.2;margin-bottom:2px}
}
@media (max-width:480px){
  .container{width:min(100% - 30px,1160px)}
  .hero-image{height:48vh;min-height:350px}
  .gallery-grid figure{aspect-ratio:3/4}
  .contact-panel{padding:22px}
}