/* ==========================================================================
   Godrej Florenne — godrejflorennesoukyaroad.com
   Palette and type taken from the project brochure: burgundy, copper, ivory.
   ========================================================================== */

:root{
  --wine:#4A1523;
  --wine-deep:#380F1A;
  --wine-soft:#6B2534;
  --copper:#B67338;
  --copper-lt:#D3A06A;
  --ivory:#F6F1E8;
  --ivory-2:#EFE7D9;
  --ink:#2C1017;
  --ink-soft:#5C4149;
  --line:rgba(74,21,35,.18);
  --page:var(--ivory);
  --text:var(--ink);
  --text-soft:var(--ink-soft);
  --panel:#FFFCF7;
  --maxw:1160px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

body{
  margin:0;background:var(--page);color:var(--text);
  font-family:"Jost","Avenir Next",Helvetica,Arial,sans-serif;
  font-weight:300;font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Marcellus","Cormorant Garamond",Georgia,serif;font-weight:400;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,5vw,3.6rem);letter-spacing:.12em}
h2{font-size:clamp(1.5rem,3.2vw,2.3rem)}
h3{font-size:1.2rem}
p{margin:0 0 1.1em;max-width:70ch}
a{color:inherit}
img,svg{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
section{padding:clamp(48px,6.5vw,88px) 0}
.alt{background:var(--ivory-2)}
.sec-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:30px}
.sec-head h2{margin:0}
.slug{font-size:.78rem;letter-spacing:.08em;color:var(--copper)}
.lead{font-size:1.1rem;color:var(--text-soft);max-width:62ch}
.note{font-size:.82rem;color:var(--text-soft);margin-top:12px}

/* ---------- minimal grid (replaces Bootstrap for the form markup) -------- */
.container{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.container-fluid{width:100%;padding:0}
.row{display:flex;flex-wrap:wrap;margin:0 -8px}
.row > [class^="col-"]{padding:0 8px;width:100%}
.col-md-12{width:100%}
@media (min-width:768px){
  .col-md-6{width:50%}
}

/* ---------------------------- header ------------------------------------ */
.strip{background:var(--copper);color:#33101A;font-size:.82rem;letter-spacing:.05em;text-align:center;padding:7px 16px}
header.bar{position:sticky;top:0;z-index:60;background:var(--wine-deep);color:#F3E4D3;border-bottom:1px solid rgba(211,160,106,.3)}
.bar-in{max-width:var(--maxw);margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:18px}
.mark{font-family:"Marcellus",serif;letter-spacing:.2em;font-size:.95rem;white-space:nowrap;text-decoration:none}
.mark span{display:block;font-family:"Jost",sans-serif;font-size:.58rem;letter-spacing:.16em;color:var(--copper-lt);margin-top:2px}
nav.primary{margin-left:auto;display:flex;gap:18px;font-size:.84rem;letter-spacing:.03em}
nav.primary a{text-decoration:none;opacity:.85;padding:4px 0;border-bottom:1px solid transparent}
nav.primary a:hover,nav.primary a:focus-visible{opacity:1;border-bottom-color:var(--copper)}
nav.primary a.active{opacity:1;border-bottom-color:var(--copper)}
.call{border:1px solid var(--copper);background:none;color:inherit;font:inherit;padding:8px 16px;border-radius:2px;font-size:.85rem;letter-spacing:.06em;white-space:nowrap;cursor:pointer}
.call:hover{background:var(--copper);color:#2A0D14}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid rgba(211,160,106,.5);color:inherit;border-radius:2px;padding:7px 12px;font:inherit;font-size:.85rem;cursor:pointer}
@media (max-width:1000px){
  nav.primary{display:none;order:3;width:100%;flex-wrap:wrap;gap:12px 18px;padding-bottom:10px}
  nav.primary.open{display:flex}
  .menu-btn{display:block}
  .bar-in{flex-wrap:wrap;gap:12px}
}

/* ---------------------------- hero -------------------------------------- */
.hero{position:relative;background:var(--wine-deep);color:#F7EFE4;overflow:hidden;padding:0}
.hero-art{position:absolute;inset:0;width:100%;height:100%;opacity:.5}
.hero-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(64px,10vw,130px) 22px clamp(50px,7vw,96px);text-align:center}
.hero h1{margin:0 0 18px;color:#FFF9F1}
.kicker{font-size:.8rem;letter-spacing:.3em;color:var(--copper-lt);margin-bottom:24px}
.rule{width:72px;height:1px;background:var(--copper);margin:0 auto 24px}
.hero .sub{font-family:"Marcellus",serif;font-size:clamp(1rem,2.2vw,1.35rem);letter-spacing:.04em;color:#EBD9C6;max-width:34ch;margin:0 auto 28px}
.facts{display:flex;flex-wrap:wrap;justify-content:center;margin-top:42px;border-top:1px solid rgba(211,160,106,.32);padding-top:24px}
.fact{padding:6px 26px;border-right:1px solid rgba(211,160,106,.28);text-align:center}
.fact:last-child{border-right:0}
.fact b{display:block;font-family:"Marcellus",serif;font-size:1.45rem;color:#FFF6EA}
.fact span{font-size:.72rem;letter-spacing:.14em;color:var(--copper-lt)}
@media (max-width:640px){.fact{flex:1 0 46%;border-right:0;padding:10px 6px}}

/* interior page head */
.page-head{background:var(--wine-deep);color:#F7EFE4;padding:clamp(40px,6vw,72px) 0 clamp(34px,5vw,56px)}
.page-head h1{color:#FFF9F1;margin-bottom:14px}
.page-head .sub{color:#E4D0BD;max-width:60ch}
.crumbs{font-size:.78rem;letter-spacing:.08em;color:var(--copper-lt);margin-bottom:18px}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:#fff}
.crumbs span{opacity:.6;margin:0 4px}

/* buttons */
.btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}
.hero .btns{justify-content:center}
.btn{display:inline-block;padding:13px 28px;border-radius:2px;text-decoration:none;font:inherit;font-size:.88rem;letter-spacing:.07em;border:1px solid var(--copper);cursor:pointer;background:none}
.btn-solid{background:var(--copper);color:#2A0D14}
.btn-solid:hover{background:var(--copper-lt)}
.btn-ghost{color:#F4E6D6}
.btn-ghost:hover{background:rgba(211,160,106,.16)}
.btn-line{color:var(--wine);border-color:var(--wine)}
.btn-line:hover{background:var(--wine);color:#FFF6EA}

/* cards, lists, tables */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);padding:24px 22px}
.card h3{margin-bottom:6px}
.card p{margin-bottom:0;font-size:.95rem;color:var(--text-soft)}
.plain{border:0;background:none;padding:0}
.tw{overflow-x:auto;border:1px solid var(--line);background:var(--panel)}
table{border-collapse:collapse;width:100%;min-width:620px;font-size:.93rem}
th,td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
thead th{background:var(--wine-deep);color:#F2E3D2;font-weight:400;letter-spacing:.06em;font-size:.8rem}
tbody tr:last-child td{border-bottom:0}
td.name{font-family:"Marcellus",serif;font-size:1.02rem}
ul.tick{list-style:none;padding:0;margin:0;display:grid;gap:10px}
ul.tick li{padding-left:22px;position:relative;font-size:.96rem}
ul.tick li::before{content:"";position:absolute;left:0;top:.68em;width:9px;height:1px;background:var(--copper)}
ul.cols{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 26px}
.legend{display:flex;flex-wrap:wrap;gap:8px 10px;list-style:none;padding:0;margin:0}
.legend li{border:1px solid var(--line);padding:7px 13px;font-size:.86rem;background:var(--panel)}
.dist{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.dist li{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.dist li span:last-child{color:var(--copper);white-space:nowrap}
.pc{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.pc > div{border-top:2px solid var(--copper);padding-top:18px}
.pc > div.consider{border-top-color:var(--wine-soft)}
blockquote{margin:0;background:var(--panel);border:1px solid var(--line);padding:22px}
blockquote p{font-family:"Marcellus",serif;font-size:1.05rem;line-height:1.6}
blockquote footer{font-size:.84rem;color:var(--text-soft)}

/* accordions */
details{border:1px solid var(--line);background:var(--panel);margin-bottom:10px}
summary{cursor:pointer;padding:15px 18px;font-family:"Marcellus",serif;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--copper);font-family:"Jost",sans-serif;font-size:1.3rem;line-height:1}
details[open] summary::after{content:"\2013"}
details .body{padding:0 18px 18px}
details .body p:last-child,details .body ul:last-child{margin-bottom:0}

/* gallery tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.tile{aspect-ratio:4/3;background:var(--wine-deep);position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:16px;color:#F0DFCC;font-size:.85rem;letter-spacing:.08em;border:0;cursor:pointer;text-align:left}
.tile svg{position:absolute;inset:0;width:100%;height:100%;opacity:.42}
.tile span{position:relative}

/* ============================= FORMS ====================================
   One system for every form on the site: popups, sidebar, enquire band
   and the footer strip. Two themes — dark (on burgundy) and light (on ivory).
   ======================================================================== */

.florenne-form{
  --f-bg:rgba(255,255,255,.06);
  --f-bg-focus:rgba(255,255,255,.11);
  --f-border:rgba(211,160,106,.42);
  --f-border-focus:var(--copper-lt);
  --f-text:#FFF6EA;
  --f-placeholder:rgba(245,233,220,.45);
  --f-label:var(--copper-lt);
  --f-error:#F0A088;
  --f-success:#9FD0A8;
  --f-height:50px;
}
.florenne-form--light{
  --f-bg:#FFFDFA;
  --f-bg-focus:#FFF;
  --f-border:rgba(74,21,35,.28);
  --f-border-focus:var(--copper);
  --f-text:var(--ink);
  --f-placeholder:rgba(92,65,73,.55);
  --f-label:var(--wine-soft);
  --f-error:#A8341B;
  --f-success:#2F6B3C;
}

.florenne-form .row{margin:0 -7px}
.florenne-form .row > [class^="col-"]{padding:0 7px}
.florenne-form .form-group{margin-bottom:16px;text-align:left}

/* labels sit above the field; placeholders repeat them for scanning */
.field-label{
  display:block;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--f-label);margin-bottom:6px;font-weight:400;
}
.field-label .opt{text-transform:none;letter-spacing:.02em;opacity:.7}

/* the fields themselves — one height, one border, no exceptions */
.florenne-form .form-control,
.florenne-form .countryCode,
.florenne-form .form-select{
  font:inherit;font-size:.95rem;font-weight:300;width:100%;
  height:var(--f-height);padding:0 15px;
  background:var(--f-bg);border:1px solid var(--f-border);
  color:var(--f-text);border-radius:2px;
  transition:border-color .15s ease, background-color .15s ease;
  -webkit-appearance:none;appearance:none;
}
.florenne-form textarea.form-control{
  height:auto;min-height:96px;padding:13px 15px;line-height:1.6;resize:vertical;
}
.florenne-form .form-control::placeholder{color:var(--f-placeholder)}
.florenne-form .form-control:hover,
.florenne-form .countryCode:hover,
.florenne-form .form-select:hover{border-color:rgba(211,160,106,.65)}
.florenne-form--light .form-control:hover,
.florenne-form--light .countryCode:hover,
.florenne-form--light .form-select:hover{border-color:rgba(74,21,35,.45)}
.florenne-form .form-control:focus,
.florenne-form .countryCode:focus,
.florenne-form .form-select:focus{
  outline:none;background:var(--f-bg-focus);
  border-color:var(--f-border-focus);box-shadow:0 0 0 3px rgba(182,115,56,.22);
}

/* selects: custom caret, since appearance is stripped */
.florenne-form .countryCode,
.florenne-form .form-select{
  padding-right:36px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23B67338' stroke-width='1.6' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
}
.florenne-form select option{color:#2C1017;background:#FFF}
.florenne-form select:invalid,
.florenne-form select option[value=""]{color:var(--f-placeholder)}
.florenne-form--light select:invalid{color:var(--f-placeholder)}

/* country code + number: one visual unit, no gap between them */
.contact_number{display:flex;align-items:stretch}
.contact_number .countryCode{
  flex:0 0 132px;width:132px;border-right:0;
  border-radius:2px 0 0 2px;padding-left:13px;padding-right:30px;
  background-position:right 10px center;
  text-overflow:ellipsis;
}
.contact_number .form-control{
  flex:1 1 auto;min-width:0;border-radius:0 2px 2px 0;
}
.contact_number .countryCode:focus{position:relative;z-index:2;border-right:1px solid var(--f-border-focus)}
.contact_number .form-control:focus{position:relative;z-index:2}

/* validation */
.florenne-form .form-control.invalid,
.florenne-form .countryCode.invalid{border-color:var(--f-error)}
.florenne-form .form-control.invalid:focus{box-shadow:0 0 0 3px rgba(240,160,136,.2)}
.field-error{
  display:none;font-size:.78rem;color:var(--f-error);margin-top:6px;line-height:1.4;
}
.field-error.show{display:block}

/* honeypot — kept out of sight and out of the tab order */
.hp-wrap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* submit row */
.form-foot{margin-top:2px}
.send_btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:50px;min-width:190px;
  background:var(--copper);color:#2A0D14;border:1px solid var(--copper);
  padding:0 34px;font:inherit;font-size:.88rem;font-weight:500;letter-spacing:.09em;
  border-radius:2px;cursor:pointer;transition:background-color .15s ease;
}
.send_btn:hover{background:var(--copper-lt);border-color:var(--copper-lt)}
.send_btn:active{transform:translateY(1px)}
.send_btn[disabled]{opacity:.75;cursor:progress}
.btn-spinner{display:none;width:15px;height:15px;border:2px solid rgba(42,13,20,.3);border-top-color:#2A0D14;border-radius:50%;animation:ff-spin .7s linear infinite}
.send_btn.is-sending .btn-spinner{display:block}
@keyframes ff-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.btn-spinner{animation-duration:2s}}

/* status line under the button */
.form-status{
  font-size:.88rem;margin:14px 0 0;padding:10px 14px;line-height:1.5;
  border-left:2px solid var(--f-success);background:rgba(159,208,168,.1);color:var(--f-text);
}
.form-status.is-error{border-left-color:var(--f-error);background:rgba(240,160,136,.1)}
.florenne-form--light .form-status{color:var(--ink)}

.form-consent{font-size:.72rem;color:rgba(235,215,198,.7);margin:12px 0 0;line-height:1.55;max-width:52ch}
.florenne-form--light .form-consent{color:var(--text-soft)}

/* two-column forms drop to one column early enough to stay comfortable */
@media (max-width:640px){
  .florenne-form.cols-2 .col-md-6{width:100%}
  .florenne-form{--f-height:48px}
  .contact_number .countryCode{flex-basis:112px;width:112px;font-size:.88rem}
  .send_btn{width:100%}
}

/* headings that sit above a form */
.form-footer h4,.form-footerwr h4{color:#FFF6EA}
.form-intro{color:#E2CDBA;font-size:.92rem;margin-bottom:20px;max-width:46ch}

/* Enquire Now band */
.Enquire_Now_service{background:var(--wine-deep);color:#F5E9DC;padding:0}
.Enquire_Now_service .row{margin:0}
.Enquire_Now_service [class^="col-"]{padding:0}
.enquire-visual{background-size:cover;background-position:center;min-height:320px;display:flex;align-items:center;justify-content:center;background-color:#2E0E15}
.enquire-visual-fallback{text-align:center;padding:30px;color:rgba(235,215,198,.6);font-size:.78rem;max-width:320px}
.enquire-visual-fallback svg{margin-bottom:12px}
.enquire_boxLeft{padding:clamp(30px,5vw,62px);max-width:620px}
.enquire_boxLeft h2{color:#FFF6EA;margin-bottom:10px}
.enquire_boxLeft > p{color:#E2CDBA;font-size:.95rem;margin-bottom:22px}
.divied{display:block;width:60px;height:1px;background:var(--copper);margin:0 0 18px}

/* Contact Us bottom strip */
.ContactUSBottom{background:var(--wine);padding:clamp(44px,6vw,72px) 0;color:#F5E9DC}
.form-footerwr{max-width:540px;margin:0 auto}
.form-footerwr h4{font-size:1.6rem;text-align:center;margin-bottom:8px}
.form-footerwr > p{text-align:center;color:#E2CDBA;font-size:.92rem;margin-bottom:24px}


/* footer */
footer.site{background:var(--wine-deep);color:#E8D6C4;padding:54px 0 26px;font-size:.88rem}
footer.site a{color:#E8D6C4;text-decoration:none}
footer.site a:hover{color:var(--copper-lt)}
.fgrid{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.fgrid h4{font-size:.76rem;letter-spacing:.14em;color:var(--copper-lt);font-family:"Jost",sans-serif;font-weight:500;margin-bottom:12px}
.fgrid ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.footer-mark{display:inline-block;color:#F3E4D3}
.footer-note{color:#C9B2A1;font-size:.84rem;margin:12px 0 0}
.disclaimer{margin-top:38px;padding-top:20px;border-top:1px solid rgba(211,160,106,.25);font-size:.75rem;color:#C4AB99;line-height:1.6;max-width:none}

/* ============================= MODALS =================================== */
.modal{
  position:fixed;inset:0;z-index:200;background:rgba(30,7,13,.72);
  display:flex;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto;
}
.modal[hidden]{display:none}
.modal-dialog{width:100%;max-width:700px;margin:auto}
.modal-content{background:var(--wine-deep);border:1px solid rgba(211,160,106,.4);padding:clamp(24px,4vw,40px);position:relative;color:#F5E9DC}
.modal-content .close{
  position:absolute;top:10px;right:12px;background:none;border:0;color:var(--copper-lt);
  font-size:1.1rem;cursor:pointer;line-height:1;padding:6px
}
.modal-content .close:hover{color:#FFF}
.modal .form-footer h4{font-size:1.5rem;margin-bottom:6px}
.modal .form-footer .form-intro{color:#E2CDBA;font-size:.92rem;margin-bottom:20px}
body.modal-open{overflow:hidden}

/* ========================== SIDEBAR ENQUIRY ============================= */
.sidebar-contact{position:fixed;top:50%;right:0;transform:translateY(-50%);z-index:150;display:flex;align-items:flex-start}
.sidebar-contact .toggle{
  background:var(--copper);color:#2A0D14;border:0;font:inherit;font-size:.82rem;letter-spacing:.1em;
  padding:16px 10px;cursor:pointer;writing-mode:vertical-rl;transform:rotate(180deg);
}
.sidebar-contact .scroll{
  width:0;overflow:hidden;background:var(--wine-deep);border-left:1px solid rgba(211,160,106,.35);
  max-height:84vh;overflow-y:auto;transition:width .25s ease;
}
.sidebar-contact.open .scroll{width:min(360px,88vw);overflow-y:auto}
.sidebar-contact .modal-form{padding:22px}
.sidebar-contact h4{font-size:1.2rem;margin-bottom:4px}
.sidebar-contact .form-footer > p{color:#E2CDBA;font-size:.85rem;margin-bottom:16px}
.sidebar-contact .florenne-form{--f-height:46px}
.sidebar-contact .form-consent{font-size:.68rem}
@media (max-width:640px){.sidebar-contact{display:none}}

/* ========================== FLOATING BAR ================================ */
.fab{position:fixed;right:18px;bottom:18px;z-index:140;display:flex;gap:10px}
.fab button{
  background:var(--copper);color:#2A0D14;border:0;font:inherit;padding:12px 20px;border-radius:2px;
  font-size:.85rem;letter-spacing:.05em;cursor:pointer;box-shadow:0 6px 20px rgba(45,10,20,.35)
}
.fab button:nth-child(n+2){background:var(--wine-deep);color:#F3E4D3;border:1px solid var(--copper)}
.fab button:hover{background:var(--copper-lt);color:#2A0D14}
@media (max-width:640px){
  .fab{left:12px;right:12px;bottom:0;gap:0}
  .fab button{flex:1;border-radius:0;padding:14px 6px;box-shadow:none;font-size:.8rem}
  body{padding-bottom:52px}
}

/* focus visibility everywhere */
a:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--copper);outline-offset:3px}

/* thank-you page */
.thanks{text-align:center;padding:clamp(60px,10vw,120px) 22px}
.thanks h1{margin-bottom:18px}