@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=DM+Sans:wght@300;400;500&family=Italianno&display=swap');
:root{--ivory:#faf7f0;--paper:#f2ecdf;--sage:#2d3528;--sage2:#3e4937;--gold:#ad8a52;--line:#d8cdbb;--ink:#26251f}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--ink);font:400 14px/1.7 "DM Sans",sans-serif}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}
.topbar{height:32px;background:#eee7d9;border-bottom:1px solid #ddd0bd;display:flex;justify-content:space-between;align-items:center;padding:0 5%;font-size:10px;letter-spacing:.04em}
.topbar .contact{display:flex;gap:22px}.topbar a:hover{color:var(--gold)}
header{position:relative;z-index:30;background:rgba(250,247,240,.97);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:17px 4.5%;transition:.35s}
header.sticky{position:fixed;top:0;left:0;right:0;box-shadow:0 8px 30px #00000012}
.brand{width:145px}.brand .v{font:500 37px/.8 "Cormorant Garamond";letter-spacing:.12em}.brand .e{font:500 17px "Cormorant Garamond";letter-spacing:.25em;margin-left:25px}.brand small{display:block;font-size:6px;letter-spacing:.16em;margin-top:7px}
nav{display:flex;gap:27px;align-items:center;font:400 10px "Cormorant Garamond";letter-spacing:.1em;text-transform:uppercase}nav a:hover{color:var(--gold)}.navcta{border:1px solid #c9b58e;padding:11px 17px}
.menu{display:none;border:0;background:none;font-size:23px}
.hero{min-height:610px;position:relative;overflow:hidden;background:#eee8db}
.hero:before{content:"";position:absolute;left:-80px;bottom:-50px;width:350px;height:390px;opacity:.5;background:url("../images/floral-accent.jpg") center/cover;mix-blend-mode:multiply;filter:sepia(.35)}
.heroVisual{position:absolute;right:0;top:0;width:59%;height:100%;background:linear-gradient(90deg,var(--ivory) 0%,#faf7f000 35%),url("../images/hero.jpg") center/cover}
.heroVisual:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0002,transparent 40%)}
.heroContent{position:relative;z-index:2;width:53%;padding:105px 0 100px 10%}
.kicker,.eyebrow{font-size:9px;letter-spacing:.2em;text-transform:uppercase}.script{font:400 58px "Italianno";color:var(--gold);line-height:.8}
.hero h1{font:500 clamp(55px,6.1vw,93px)/.85 "Cormorant Garamond";letter-spacing:.015em;text-transform:uppercase;margin:13px 0 25px}.hero h1 em{font-style:normal;color:#705d3e}
.heroCopy{max-width:390px;font-size:13px}.buttons{display:flex;gap:12px;margin-top:25px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;background:var(--sage);color:#fff;text-transform:uppercase;letter-spacing:.1em;font-size:9px;border:1px solid var(--sage);transition:.3s}.btn:hover{background:var(--gold);border-color:var(--gold)}.btn.alt{background:transparent;color:#806943;border-color:#c4aa7c}
.flowerLine{font:32px "Cormorant Garamond";color:#b39868;letter-spacing:.3em}
.intro{padding:45px 9%;display:grid;grid-template-columns:130px 1fr 1.1fr;gap:45px;align-items:center;border-bottom:1px solid var(--line)}.year{font:54px "Cormorant Garamond";color:#9b7b47}.intro h2,.sectionTitle{font:400 clamp(38px,4vw,58px)/.95 "Cormorant Garamond";margin:5px 0 15px}.intro h2 em,.sectionTitle em{font-style:italic;color:#806b4b}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}.pillar{text-align:center}.icon{font-size:25px;color:var(--gold);display:block;margin-bottom:6px}.pillar b{font:500 15px "Cormorant Garamond";display:block}.pillar span{font-size:10px}
.section{padding:70px 6.5%}.sectionHead{text-align:center;margin-bottom:32px}.sectionHead .script{font-size:43px}.sectionHead .flowerLine{font-size:21px}
.serviceGrid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.service{background:#f1ebdf;border:1px solid #e0d5c4;transition:.45s;overflow:hidden}.service:hover{transform:translateY(-9px);box-shadow:0 15px 35px #4c422c1a}.serviceImg{height:150px;overflow:hidden}.serviceImg img{height:100%;width:100%;object-fit:cover;transition:.6s}.service:hover img{transform:scale(1.07)}.serviceBody{text-align:center;padding:18px 12px 20px}.serviceBody h3{font:500 18px/1.05 "Cormorant Garamond";text-transform:uppercase;margin:0 0 9px}.serviceBody p{font-size:10px;line-height:1.45;margin:0}
.featured{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.weddingGrid{display:grid;grid-template-columns:1.1fr repeat(4,1fr);height:240px;gap:3px}.weddingCard{position:relative;overflow:hidden}.weddingCard img{height:100%;width:100%;object-fit:cover;transition:.7s}.weddingCard:hover img{transform:scale(1.08)}.weddingCard:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#0009)}.weddingText{position:absolute;z-index:2;bottom:15px;left:17px;color:#fff;font:17px "Cormorant Garamond";line-height:1.05}.weddingText small{display:block;font:8px "DM Sans";letter-spacing:.14em;margin-top:4px}
.centerBtn{text-align:center;margin-top:25px}
.stats{background:var(--sage);color:#f7f1e6;display:grid;grid-template-columns:repeat(5,1fr);padding:25px 7%;text-align:center;border-top:1px solid #8c7957}.stat{border-right:1px solid #8d927f}.stat:last-child{border:0}.stat strong{font:45px "Cormorant Garamond";display:block}.stat span{font-size:8px;letter-spacing:.13em;text-transform:uppercase}
.enquiry{padding:70px 8%;display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:center;background:#f5efe3}.enquiry h2{font:400 clamp(48px,5vw,72px)/.9 "Cormorant Garamond";margin:10px 0 20px;text-transform:uppercase}.enquiry h2 em{font:58px "Italianno";color:var(--gold);text-transform:none}.enquiryPhoto{height:330px;overflow:hidden;position:relative}.enquiryPhoto img{width:100%;height:100%;object-fit:cover}.enquiryPhoto:after{content:"";position:absolute;inset:0;background:#fff2;mix-blend-mode:screen}.formBox h3{font:400 25px "Cormorant Garamond";text-transform:uppercase}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.formBox input,.formBox select,.formBox textarea{width:100%;border:0;border-bottom:1px solid #cfc3b0;background:transparent;padding:11px 5px;margin-bottom:8px;font:11px "DM Sans";outline:0}.formBox textarea{grid-column:1/-1}.formBox button{width:100%;border:0;background:var(--sage);color:#fff;padding:14px;margin-top:5px;text-transform:uppercase;letter-spacing:.13em;font-size:9px;cursor:pointer}
footer{background:#252d22;color:#f4eee2;padding:55px 7% 18px;position:relative;overflow:hidden}.footerTop{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:45px;border-bottom:1px solid #68705e;padding-bottom:35px}.footerBrand .v{font:500 36px "Cormorant Garamond";letter-spacing:.12em}.footerBrand .e{font:18px "Cormorant Garamond";letter-spacing:.3em;margin-left:20px}.footerTitle{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:#cbb489;margin-bottom:13px}.footerLinks a,.footerLinks span{display:block;font:11px "Cormorant Garamond";margin:5px 0;color:#e8e0d3}.copyright{font-size:8px;color:#aeb4a5;padding-top:15px;display:flex;justify-content:space-between}.footerFlower{position:absolute;right:-20px;bottom:-90px;font-size:260px;color:#bba16c22}
.whatsapp{position:fixed;right:18px;bottom:18px;z-index:50;width:55px;height:55px;border-radius:50%;background:#20b85a;color:#fff;display:grid;place-items:center;font-size:24px;box-shadow:0 8px 25px #0003}
.pageHero{background:var(--paper);text-align:center;padding:100px 8% 70px;border-bottom:1px solid var(--line)}.pageHero h1{font:500 clamp(52px,7vw,95px) "Cormorant Garamond";text-transform:uppercase;margin:15px}.pageHero em{font-style:italic;color:#806b4b}.content{padding:70px 9%}.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.twoCol img{height:560px;object-fit:cover}.largeText{font:400 clamp(34px,4vw,56px)/1 "Cormorant Garamond"}.serviceList{display:grid;grid-template-columns:1fr 1fr;gap:0 45px}.serviceRow{padding:25px 0;border-bottom:1px solid var(--line)}.serviceRow h2{font:400 32px "Cormorant Garamond";margin:0 0 5px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gallery img{height:370px;object-fit:cover}.contactPage{display:grid;grid-template-columns:1fr 1fr;gap:60px}.contactPage form{background:#eee7d9;padding:35px}.contactPage input,.contactPage select,.contactPage textarea{width:100%;padding:13px 3px;border:0;border-bottom:1px solid #c8bca8;background:transparent;margin:6px 0 12px;font:12px "DM Sans"}.contactPage button{width:100%;padding:15px;border:0;background:var(--sage);color:#fff;letter-spacing:.12em;text-transform:uppercase;font-size:9px}
.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1000px){nav{gap:14px}.serviceGrid{grid-template-columns:repeat(3,1fr)}.weddingGrid{grid-template-columns:1.3fr repeat(2,1fr);height:360px}.weddingCard:nth-child(n+4){display:none}.intro{grid-template-columns:100px 1fr}.pillars{grid-column:1/-1}.enquiry{grid-template-columns:1fr}.footerTop{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.topbar{display:none}header{padding:15px 5%}.menu{display:block}nav{display:none;position:absolute;left:0;right:0;top:76px;background:var(--ivory);padding:20px;flex-direction:column;align-items:flex-start;box-shadow:0 15px 25px #0002}nav.open{display:flex}.hero{min-height:680px}.heroVisual{width:100%;opacity:.48}.heroContent{width:100%;padding:100px 7% 60px}.hero h1{font-size:58px}.hero:before{opacity:.25}.intro{grid-template-columns:1fr;padding:40px 7%}.pillars{grid-template-columns:1fr 1fr}.serviceGrid{grid-template-columns:1fr 1fr}.serviceImg{height:120px}.weddingGrid{grid-template-columns:1fr 1fr;height:430px}.weddingCard:first-child{grid-column:1/-1}.weddingCard:nth-child(n+4){display:none}.stats{grid-template-columns:1fr 1fr;gap:20px}.stat:nth-child(2){border:0}.enquiry{padding:55px 7%}.formGrid{grid-template-columns:1fr}.footerTop{grid-template-columns:1fr 1fr;gap:30px}.copyright{display:block}.copyright span{display:block;margin-top:7px}.pageHero{padding:75px 6% 55px}.twoCol,.contactPage{grid-template-columns:1fr;gap:35px}.twoCol img{height:400px}.serviceList{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.gallery img{height:270px}}/* =========================================
   VERA EVENTS - TYPOGRAPHY ENHANCEMENT
   ========================================= */

/* Main navigation */
nav {
    font-size: 13px !important;
    letter-spacing: 0.12em !important;
}

nav a {
    font-size: 13px !important;
}

/* Top contact bar */
.topbar {
    font-size: 12px !important;
}

.topbar a,
.topbar span {
    font-size: 12px !important;
}

/* Logo */
.brand .v {
    font-size: 40px !important;
    letter-spacing: 0.15em !important;
}

.brand .e {
    font-size: 19px !important;
    letter-spacing: 0.25em !important;
}

.brand small {
    font-size: 7px !important;
}

/* Hero small script */
.kicker,
.hero .script {
    font-size: 26px !important;
}

/* Main hero heading */
.hero h1 {
    font-size: clamp(65px, 7vw, 105px) !important;
    line-height: 0.88 !important;
    letter-spacing: 0.01em !important;
}

/* Hero description */
.heroCopy {
    font-size: 17px !important;
    line-height: 1.7 !important;
}

/* Hero buttons */
.heroCopy .btn,
.buttons .btn {
    font-size: 11px !important;
    letter-spacing: 0.12em !important;
    padding: 16px 25px !important;
}

/* Section headings */
.sectionTitle,
.intro h2 {
    font-size: clamp(42px, 5vw, 70px) !important;
    line-height: 1 !important;
}

/* Normal website text */
body {
    font-size: 16px !important;
}

/* Mobile */
@media (max-width: 768px) {

    nav a {
        font-size: 14px !important;
    }

    .hero h1 {
        font-size: clamp(48px, 13vw, 72px) !important;
    }

    .heroCopy {
        font-size: 16px !important;
    }

    .sectionTitle,
    .intro h2 {
        font-size: 42px !important;
    }
}/* =========================================================
   VERA EVENTS — HOMEPAGE V3
   ========================================================= */

.heroVisual {
    transform: scale(1.01);
    transition: transform 8s ease;
}

.hero:hover .heroVisual {
    transform: scale(1.06);
}

.heroContent {
    animation: veraHeroReveal 1.1s cubic-bezier(.22,1,.36,1) both;
}

.hero .script {
    animation: veraFadeUp .9s .15s both;
}

.hero h1 {
    animation: veraFadeUp 1s .28s both;
}

.heroCopy {
    animation: veraFadeUp .9s .45s both;
}

.buttons {
    animation: veraFadeUp .9s .58s both;
}


/* INTRO */

.intro {
    padding-top: 75px;
    padding-bottom: 75px;
}

.pillar {
    padding: 20px 12px;
    transition: .4s ease;
}

.pillar:hover {
    transform: translateY(-7px);
}

.pillar .icon {
    transition: .4s ease;
}

.pillar:hover .icon {
    transform: scale(1.2);
    color: var(--gold);
}


/* SERVICES */

.service {
    position: relative;
}

.service::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid transparent;
    pointer-events: none;
    transition: .4s ease;
}

.service:hover::after {
    border-color: #ad8a5266;
}

.serviceImg {
    height: 190px;
}

.serviceBody {
    min-height: 145px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.serviceBody h3 {
    font-size: 22px;
}


/* FEATURED WEDDINGS */

.featured {
    padding-top: 90px;
    padding-bottom: 90px;
}

.weddingGrid {
    height: 390px;
}

.weddingCard img {
    filter: saturate(.88);
}

.weddingCard:hover img {
    filter: saturate(1);
}


/* STATS */

.stats {
    padding-top: 45px;
    padding-bottom: 45px;
}

.stat {
    padding: 10px 20px;
}

.stat strong {
    font-size: 58px;
    transition: .4s ease;
}

.stat:hover strong {
    color: #d2b47b;
    transform: translateY(-4px);
}


/* ENQUIRY */

.enquiry {
    padding-top: 100px;
    padding-bottom: 100px;
}

.enquiryPhoto {
    overflow: hidden;
}

.enquiryPhoto img {
    transition: transform 1.2s ease;
}

.enquiryPhoto:hover img {
    transform: scale(1.05);
}


/* =========================================================
   CLIENT LOVE
   ========================================================= */

.clientLove {
    background: #faf7f0;
    padding: 100px 8%;
    text-align: center;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.clientLoveInner {
    max-width: 900px;
    margin: auto;
}

.clientLove .script {
    font-size: 48px;
}

.clientLove h2 {
    font: 400 clamp(42px, 5vw, 70px)/.95 "Cormorant Garamond";
    margin: 10px 0 35px;
    text-transform: uppercase;
}

.clientQuote {
    font: 400 clamp(24px, 3vw, 38px)/1.35 "Cormorant Garamond";
    color: #403d35;
    max-width: 780px;
    margin: auto;
}

.clientStars {
    color: var(--gold);
    font-size: 17px;
    letter-spacing: 7px;
    margin: 30px 0 18px;
}

.clientName {
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #827660;
}


/* =========================================================
   FIND YOUR STYLE
   ========================================================= */

.styleCTA {
    position: relative;
    overflow: hidden;
    background: var(--sage);
    color: #fff;
    padding: 90px 8%;
    text-align: center;
}

.styleCTA::before {
    content: "V";
    position: absolute;
    font: 500 400px "Cormorant Garamond";
    color: #ffffff08;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.styleCTAInner {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: auto;
}

.styleCTA .script {
    font-size: 48px;
    color: #c7a76e;
}

.styleCTA h2 {
    font: 400 clamp(45px, 5vw, 72px)/.9 "Cormorant Garamond";
    text-transform: uppercase;
    margin: 15px 0 20px;
}

.styleCTA p {
    max-width: 550px;
    margin: 0 auto 30px;
    color: #d8d8ce;
}

.styleCTA .btn {
    background: #f5efe3;
    color: var(--sage);
    border-color: #f5efe3;
}

.styleCTA .btn:hover {
    background: var(--gold);
    color: white;
    border-color: var(--gold);
}


/* ANIMATIONS */

@keyframes veraHeroReveal {
    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes veraFadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* MOBILE */

@media(max-width:720px) {

    .heroVisual {
        transform: none;
    }

    .hero:hover .heroVisual {
        transform: none;
    }

    .intro {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .serviceImg {
        height: 150px;
    }

    .featured {
        padding-top: 65px;
        padding-bottom: 65px;
    }

    .weddingGrid {
        height: 430px;
    }

    .clientLove {
        padding: 70px 7%;
    }

    .clientLove .script {
        font-size: 38px;
    }

    .styleCTA {
        padding: 70px 7%;
    }

    .styleCTA .script {
        font-size: 38px;
    }

    .styleCTA h2 {
        font-size: 46px;
    }
}