/* ==========================================================================
   Grout Of This World — main stylesheet
   Accent: #beb8af (replaces Floens orange #c7844f)
   ========================================================================== */

:root{
    /* Brand palette — supplied by client */
    --gotw-navy:          #1E2A3A;  /* primary dark */
    --gotw-slate:         #3D5166;  /* secondary blue-grey */
    --gotw-grey:          #7C848E;  /* mid grey */
    --gotw-taupe:         #B7B1A6;  /* warm taupe — accent */
    --gotw-cream:         #F1EFEB;  /* off-white */

    /* Functional aliases (keep old names for backwards compat across templates) */
    --gotw-accent:        var(--gotw-taupe);
    --gotw-accent-dark:   #9a9489;
    --gotw-accent-light:  #d8d3c9;
    --gotw-dark:          var(--gotw-navy);
    --gotw-dark-2:        var(--gotw-slate);
    --gotw-text:          #4a4f57;
    --gotw-muted:         var(--gotw-grey);
    --gotw-bg:            #ffffff;
    --gotw-bg-2:          var(--gotw-cream);
    --gotw-border:        #e4e1da;
    --gotw-white:         #ffffff;

    --gotw-radius:        8px;
    --gotw-radius-lg:     14px;

    /* Typography — free Google Fonts close to client brand fonts (Horsham → Cormorant Garamond, Gilroy → Manrope) */
    --gotw-font-sans:     'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --gotw-font-serif:    'Cormorant Garamond', Georgia, serif;

    --gotw-shadow:        0 10px 40px rgba(30,42,58,.08);
    --gotw-shadow-lg:     0 20px 60px rgba(30,42,58,.15);
    --gotw-container:     1280px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{
    margin:0;
    font-family:var(--gotw-font-sans);
    color:var(--gotw-text);
    background:var(--gotw-bg);
    line-height:1.6;
    font-size:16px;
    -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--gotw-accent-dark);text-decoration:none;transition:.2s}
a:hover{color:var(--gotw-dark)}
h1,h2,h3,h4,h5{font-family:var(--gotw-font-serif);color:var(--gotw-dark);margin:0 0 .6em;line-height:1.15;font-weight:600;letter-spacing:-.01em}
p{margin:0 0 1em}

.gotw-container{max-width:var(--gotw-container);margin:0 auto;padding:0 24px;width:100%}

/* ========================== Buttons ========================== */
.gotw-btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:14px 28px;border-radius:50px;
    font-weight:600;font-size:14px;letter-spacing:.4px;text-transform:uppercase;
    border:2px solid transparent;cursor:pointer;transition:.25s;
    text-decoration:none;
}
.gotw-btn-primary{background:var(--gotw-accent);color:var(--gotw-dark);border-color:var(--gotw-accent)}
.gotw-btn-primary:hover{background:var(--gotw-dark);color:var(--gotw-accent);border-color:var(--gotw-dark)}
.gotw-btn-lg{padding:18px 36px;font-size:15px}
.gotw-btn i{font-size:.8em}

/* ========================== Header ========================== */
.gotw-header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    background:transparent;
    border-bottom:1px solid transparent;
    transition:background .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.gotw-header.is-scrolled{
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(10px);
    border-bottom-color:var(--gotw-border);
    box-shadow:0 4px 20px rgba(0,0,0,.05);
}
.gotw-header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:14px 24px}
.gotw-logo{display:inline-flex;align-items:center;position:relative}
.gotw-logo img{height:54px;width:auto;display:block;transition:opacity .3s ease, height .3s ease}
.gotw-header:not(.is-scrolled) .gotw-logo img{height:70px}
.gotw-logo-dark{position:absolute;top:0;left:0;opacity:0;pointer-events:none}
.gotw-header.is-scrolled .gotw-logo-light{opacity:0}
.gotw-header.is-scrolled .gotw-logo-dark{opacity:1;position:static}
.gotw-header.is-scrolled .gotw-logo-light{position:absolute;top:0;left:0}
.gotw-nav{flex:1;display:flex;justify-content:center}
.gotw-menu{display:flex;list-style:none;margin:0;padding:0;gap:38px}
.gotw-menu a{
    color:#fff;font-weight:600;font-size:14px;
    text-transform:uppercase;letter-spacing:.5px;
    position:relative;padding:8px 0;
    transition:color .3s ease;
}
.gotw-header.is-scrolled .gotw-menu a{color:var(--gotw-dark)}
.gotw-menu a::after{
    content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
    background:var(--gotw-accent);transition:width .3s ease;
}
.gotw-menu a:hover::after,.gotw-menu .current-menu-item a::after{width:100%}
.gotw-header-cta{flex-shrink:0}
.gotw-burger{display:none;background:none;border:0;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.gotw-burger span{width:26px;height:2px;background:#fff;transition:background .3s ease}
.gotw-header.is-scrolled .gotw-burger span{background:var(--gotw-dark)}

/* ========================== Hero ========================== */
.gotw-hero{
    height:100vh;
    min-height:640px;
    margin-top:0;
    background-size:cover;background-position:center;background-repeat:no-repeat;
    color:#fff;
    display:flex;align-items:center;justify-content:center;
    padding:0;
    position:relative;
}
.gotw-hero-inner{max-width:880px;text-align:center;margin:0 auto;padding:0 24px}
.gotw-eyebrow{
    display:inline-block;font-size:13px;font-weight:700;
    text-transform:uppercase;letter-spacing:3px;
    color:var(--gotw-accent-dark);margin-bottom:18px;
    position:relative;padding:0 30px;
}
.gotw-eyebrow::before,.gotw-eyebrow::after{
    content:"";position:absolute;top:50%;width:20px;height:1px;background:currentColor;
}
.gotw-eyebrow::before{left:0}
.gotw-eyebrow::after{right:0}
.gotw-eyebrow-light{color:var(--gotw-accent)}
.gotw-hero-title{
    font-size:clamp(34px,3.8vw,42px);
    font-weight:800;color:#fff;
    line-height:1.1;margin-bottom:22px;
    text-transform:uppercase;letter-spacing:-.5px;
    margin-top:250px;
    font-family:'Josefin Sans', sans-serif;
}
.gotw-hero-sub{font-size:18px;max-width:680px;margin:0 auto 16px;opacity:.92}
.gotw-hero-tag{font-family:var(--gotw-font-serif);font-style:italic;font-size:20px;color:var(--gotw-accent);margin-bottom:32px}
.gotw-hero-scroll{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);color:#fff;opacity:.7;animation:bounce 2s infinite}
.gotw-hero-scroll a{color:#fff;font-size:24px}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(10px)}}

/* ========================== Sections base ========================== */
.gotw-section{padding:110px 0;position:relative;background-size:cover;background-position:center;background-repeat:no-repeat}
.gotw-section-head{margin-bottom:60px}
.gotw-section-head-center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}
.gotw-section-title{font-size:clamp(32px,4vw,52px);font-weight:600;line-height:1.1;letter-spacing:-.01em;text-transform:none}
.gotw-section-title-light{color:#fff}
.gotw-prose p{font-size:16px;color:var(--gotw-text)}

/* ========================== About ========================== */
.gotw-about{background:var(--gotw-bg)}
.gotw-about-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:center}
.gotw-about-media{position:relative}
.gotw-about-media img{border-radius:var(--gotw-radius-lg);box-shadow:var(--gotw-shadow-lg)}
.gotw-about-stat{
    position:absolute;bottom:24px;right:-24px;
    background:var(--gotw-accent);color:var(--gotw-dark);
    padding:24px 32px;border-radius:var(--gotw-radius);
    box-shadow:var(--gotw-shadow-lg);text-align:center;
}
.gotw-stat-value{display:block;font-size:38px;font-weight:800;line-height:1}
.gotw-stat-label{display:block;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-top:6px}

/* ========================== Services ========================== */
.gotw-services{background-color:var(--gotw-bg-2);background-position:right top;background-repeat:no-repeat;background-size:auto}
.gotw-services-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
}
.gotw-service-card{
    background:#fff;border-radius:var(--gotw-radius-lg);
    padding:36px 32px;box-shadow:var(--gotw-shadow);
    border:1px solid var(--gotw-border);
    transition:.3s;position:relative;overflow:hidden;
}
.gotw-service-card:hover{transform:translateY(-6px);box-shadow:var(--gotw-shadow-lg);border-color:var(--gotw-accent)}
.gotw-service-icon{
    width:70px;height:70px;border-radius:50%;
    background:var(--gotw-accent-light);color:var(--gotw-accent-dark);
    display:flex;align-items:center;justify-content:center;
    font-size:28px;margin-bottom:24px;transition:.3s;
}
.gotw-service-card:hover .gotw-service-icon{background:var(--gotw-accent);color:#fff}
.gotw-service-image{
    width:100%;height:170px;border-radius:var(--gotw-radius);
    background-size:cover;background-position:center;margin-bottom:24px;
}
.gotw-service-card h3{font-size:22px;margin-bottom:12px}
.gotw-service-card p{font-size:15px;color:var(--gotw-muted);margin-bottom:18px}
.gotw-service-link{font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--gotw-dark)}
.gotw-service-link:hover{color:var(--gotw-accent-dark)}
.gotw-service-link i{margin-left:6px;transition:.3s}
.gotw-service-link:hover i{transform:translateX(4px)}

/* ========================== Why ========================== */
.gotw-why{background-color:var(--gotw-bg);background-position:left bottom;background-repeat:no-repeat;background-size:auto}
.gotw-why-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}
.gotw-why-media img{border-radius:var(--gotw-radius-lg);box-shadow:var(--gotw-shadow-lg)}
.gotw-check-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;margin-top:30px}
.gotw-check-list li{display:flex;align-items:flex-start;gap:12px;font-weight:500;color:var(--gotw-dark)}
.gotw-check-list i{color:var(--gotw-accent-dark);font-size:18px;flex-shrink:0;margin-top:3px}

/* ========================== Projects ========================== */
.gotw-projects{color:#fff}
.gotw-gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.gotw-gallery-item{position:relative;overflow:hidden;border-radius:var(--gotw-radius-lg);aspect-ratio:1/1.1}
.gotw-gallery-item img{width:100%;height:100%;object-fit:cover;transition:.5s}
.gotw-gallery-item:hover img{transform:scale(1.08)}
.gotw-gallery-caption{
    position:absolute;left:0;right:0;bottom:0;
    padding:20px;color:#fff;
    background:linear-gradient(transparent,rgba(0,0,0,.85));
    font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:14px;
}
.gotw-gallery-caption span{border-left:3px solid var(--gotw-accent);padding-left:12px}

/* ========================== CTA banner ========================== */
.gotw-cta-banner{padding:90px 0;background-size:cover;background-position:center;color:#fff;text-align:center}
.gotw-cta-inner{max-width:780px;margin:0 auto}
.gotw-cta-banner h2{font-size:clamp(32px,3.8vw,48px);color:#fff;font-weight:600;margin-bottom:18px;letter-spacing:-.01em}
.gotw-cta-banner p{font-size:17px;opacity:.92;margin-bottom:28px}

/* ========================== Contact ========================== */
.gotw-contact{background-color:#fff;background-position:right center;background-repeat:no-repeat;background-size:contain}
.gotw-contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start}
.gotw-contact-intro{font-size:17px;color:var(--gotw-muted);margin-bottom:30px}
.gotw-contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:22px}
.gotw-contact-list li{display:flex;gap:18px;align-items:flex-start}
.gotw-contact-list i{
    width:48px;height:48px;border-radius:50%;
    background:var(--gotw-accent-light);color:var(--gotw-accent-dark);
    display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;
}
.gotw-contact-list span{display:block;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--gotw-muted);margin-bottom:4px}
.gotw-contact-list a{color:var(--gotw-dark);font-weight:600;font-size:16px}
.gotw-contact-list a:hover{color:var(--gotw-accent-dark)}

.gotw-contact-form-wrap{background:#fff;padding:40px;border-radius:var(--gotw-radius-lg);box-shadow:var(--gotw-shadow-lg);border:1px solid var(--gotw-border)}
.gotw-contact-form-wrap h3{font-size:24px;margin-bottom:24px;text-transform:uppercase}
.gotw-form .gotw-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.gotw-form input,.gotw-form select,.gotw-form textarea,
.wpcf7 input[type="text"],.wpcf7 input[type="email"],.wpcf7 input[type="tel"],.wpcf7 textarea,.wpcf7 select{
    width:100%;padding:14px 18px;
    border:1px solid var(--gotw-border);background:var(--gotw-bg-2);
    border-radius:var(--gotw-radius);font-family:inherit;font-size:15px;color:var(--gotw-dark);
    transition:.2s;
}
.gotw-form input:focus,.gotw-form select:focus,.gotw-form textarea:focus,
.wpcf7 input:focus,.wpcf7 textarea:focus,.wpcf7 select:focus{
    outline:none;border-color:var(--gotw-accent);background:#fff;
}
.gotw-form textarea{margin-bottom:20px;resize:vertical;width:100%}
.gotw-form button{border:none;cursor:pointer;width:100%;justify-content:center}
.gotw-form-success{padding:14px 18px;background:#e6f4ea;color:#1e6b3a;border-radius:var(--gotw-radius);margin-bottom:18px;font-weight:500}
.gotw-form-error{padding:14px 18px;background:#fce8e8;color:#a32424;border-radius:var(--gotw-radius);margin-bottom:18px;font-weight:500}

/* ========================== Footer ========================== */
.gotw-footer{background:#141414 url() no-repeat right bottom;background-size:contain;color:#bbb;padding-top:80px}
.gotw-footer-inner{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:50px;padding-bottom:50px;align-items:start}
.gotw-footer h4{color:#fff;font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:22px;font-family:var(--gotw-font-sans);font-weight:700}
.gotw-footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.gotw-footer ul li,.gotw-footer p{color:#aaa;font-size:14px;line-height:1.7}
.gotw-footer a{color:#bbb}
.gotw-footer a:hover{color:var(--gotw-accent)}
.gotw-footer i{color:var(--gotw-accent);margin-right:8px;width:18px}
.gotw-social{display:flex !important;flex-direction:row !important;gap:10px !important;margin-top:18px !important}
.gotw-social li{list-style:none}
.gotw-social a{
    display:inline-flex;align-items:center;justify-content:center;
    width:38px;height:38px;border-radius:50%;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
    color:#fff;transition:.25s;
}
.gotw-social a:hover{background:var(--gotw-accent);border-color:var(--gotw-accent);color:var(--gotw-navy)}
.gotw-social i{color:inherit;margin:0;width:auto;font-size:14px}
.gotw-footer-bottom{border-top:1px solid #2a2a2a;padding:24px 0;text-align:center}
.gotw-footer-bottom p{margin:0;font-size:13px;color:#888}

/* ========================== Responsive ========================== */
@media (max-width: 1024px){
    .gotw-about-grid,.gotw-why-grid,.gotw-contact-grid{grid-template-columns:1fr;gap:50px}
    .gotw-services-grid{grid-template-columns:repeat(2,1fr)}
    .gotw-gallery-grid{grid-template-columns:repeat(2,1fr)}
    .gotw-footer-inner{grid-template-columns:1fr 1fr;gap:40px}
    .gotw-section{padding:80px 0}
}
@media (max-width: 768px){
    .gotw-nav{position:fixed;top:80px;left:0;right:0;background:#fff;padding:24px;display:none;border-bottom:1px solid var(--gotw-border)}
    .gotw-nav.is-open{display:block}
    .gotw-nav .gotw-menu a{color:var(--gotw-dark)}
    .gotw-menu{flex-direction:column;gap:18px}
    .gotw-burger{display:flex}
    .gotw-header-cta{display:none}
    .gotw-about-stat{right:12px;bottom:12px;padding:18px 22px}
    .gotw-stat-value{font-size:28px}
    .gotw-services-grid{grid-template-columns:1fr}
    .gotw-gallery-grid{grid-template-columns:1fr}
    .gotw-check-list{grid-template-columns:1fr}
    .gotw-form .gotw-form-row{grid-template-columns:1fr}
    .gotw-footer-inner{grid-template-columns:1fr;gap:36px;text-align:center}
    .gotw-footer ul{align-items:center}
    .gotw-contact-form-wrap{padding:28px 22px}
}