*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
:root{
  --pink:#E57689;--pink-hover:#cf6070;--pink-light:#fdf0f2;--pink-mid:#fad8dd;
  --teal:#88CDCA;--teal-light:#eef8f8;--teal-mid:#c5e9e8;--teal-dark:#2a7a78;
  --black:#141414;--dark:#1e1e1e;--gray:#6b6b6b;--gray-light:#f2f2f0;
  --border:#e4e4e0;--white:#ffffff;
}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--gray-light);color:var(--black)}
a{text-decoration:none}

/* NAV */
nav{
  background:rgba(255,255,255,0.95);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  height:72px;padding:0 64px;
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:100;
}
.nav-links{display:flex;gap:32px;list-style:none}
.nav-links a{font-size:14px;font-weight:500;color:var(--gray);transition:color .2s}
.nav-links a:hover{color:var(--black)}
.btn-back{
  display:inline-flex;align-items:center;gap:8px;
  font-size:14px;font-weight:600;color:var(--gray);
  background:transparent;border:1.5px solid var(--border);
  padding:9px 18px;border-radius:100px;cursor:pointer;transition:all .2s;
}
.btn-back:hover{border-color:var(--black);color:var(--black)}

/* HERO */
.page-hero{
  background:var(--black);padding:56px 64px 52px;
}
.page-hero h1{font-size:clamp(28px,4vw,44px);font-weight:800;color:white;letter-spacing:-1px;margin-bottom:10px}
.page-hero p{font-size:15px;font-weight:300;color:rgba(255,255,255,0.5);max-width:480px}

/* MAIN LAYOUT */
.main-grid{
  display:grid;grid-template-columns:1fr 340px;
  gap:28px;
  max-width:1100px;margin:0 auto;
  padding:40px 64px 80px;
  align-items:start;
  width:100%;
}

/* FORM CARD */
.form-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:20px;padding:36px;
}
.form-section{margin-bottom:32px}
.form-section:last-child{margin-bottom:0}
.section-title{
  font-size:13px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--black);
  margin-bottom:16px;display:flex;align-items:center;gap:8px;
}
.section-num{
  width:22px;height:22px;border-radius:50%;
  background:var(--pink);color:white;
  font-size:11px;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.section-divider{border:none;border-top:1px solid var(--border);margin:28px 0}

/* OPTION BUTTONS */
.option-grid{display:flex;flex-wrap:wrap;gap:10px}
.opt-icon{font-size:18px}

/* FORM FIELDS */
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.field-row.three{grid-template-columns:1fr 1fr 1fr}
.field-single{margin-bottom:14px}
.field-label{
  font-size:12px;font-weight:600;color:var(--dark);
  margin-bottom:6px;display:block;
}
.field-label .req{color:var(--pink)}
.field-input{
  width:100%;background:var(--gray-light);
  border:1.5px solid var(--border);border-radius:10px;
  padding:12px 16px;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:14px;color:var(--black);
  outline:none;transition:border-color .2s,background .2s;
}
.field-input:focus{border-color:var(--teal);background:white}
.field-input::placeholder{color:#b0b0aa}
textarea.field-input{height:110px;resize:none}

/* ROOMS */
.rooms-row{display:flex;gap:8px}

/* PHOTO UPLOAD */
.upload-area{
  border:2px dashed var(--border);border-radius:12px;
  padding:28px;text-align:center;cursor:pointer;
  transition:border-color .2s,background .2s;
  position:relative;
}
.upload-area:hover{border-color:var(--teal);background:var(--teal-light)}
.upload-icon{font-size:28px;margin-bottom:8px}
.upload-text{font-size:14px;font-weight:500;color:var(--dark);margin-bottom:4px}
.upload-sub{font-size:12px;color:var(--gray)}
.upload-input{position:absolute;inset:0;opacity:0;cursor:pointer}
.upload-preview{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.upload-thumb{
  width:64px;height:64px;border-radius:8px;
  object-fit:cover;border:1px solid var(--border);
}

/* SUBMIT */
.submit-btn{
  width:100%;background:var(--pink);color:white;
  border:none;padding:16px;border-radius:100px;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:16px;font-weight:700;cursor:pointer;
  transition:all .2s;margin-top:8px;
  display:flex;align-items:center;justify-content:center;gap:10px;
}
.submit-btn:hover{background:var(--pink-hover);transform:translateY(-1px)}
.submit-btn-wa{background:#25D366}
.submit-btn-wa:hover{background:#1ebe5d}
.form-note{font-size:12px;color:var(--gray);text-align:center;margin-top:12px;line-height:1.5}

/* SIDEBAR */
.sidebar{display:flex;flex-direction:column;gap:16px}
.side-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:16px;padding:22px;
}
.side-card h3{font-size:15px;font-weight:700;color:var(--black);margin-bottom:14px}
.side-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.side-list li{
  display:flex;align-items:center;gap:10px;
  font-size:13px;color:var(--dark);
}
.side-check{
  width:20px;height:20px;border-radius:50%;
  background:var(--teal-light);
  display:flex;align-items:center;justify-content:center;
  font-size:10px;color:var(--teal-dark);font-weight:700;flex-shrink:0;
}
.side-wa{
  background:var(--black);border-radius:14px;padding:20px;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;
}
.side-wa h3{font-size:14px;font-weight:700;color:white;margin:0}
.side-wa p{font-size:12px;color:rgba(255,255,255,0.45);margin:0;line-height:1.5}
.wa-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:#25D366;color:white;padding:11px 20px;
  border-radius:100px;font-size:13px;font-weight:700;
  width:100%;justify-content:center;transition:opacity .2s;
}
.wa-btn:hover{opacity:0.88}
.side-team{display:flex;align-items:center;gap:10px;margin-top:4px}
.team-av{
  width:36px;height:36px;border-radius:50%;
  background:var(--pink-mid);display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:var(--pink);flex-shrink:0;
}
.team-av.teal{background:var(--teal-light);color:var(--teal-dark)}
.side-rating{
  display:flex;align-items:center;gap:10px;
  background:var(--gray-light);border-radius:10px;padding:12px 14px;
}
.rating-stars{color:var(--pink);font-size:14px;letter-spacing:1px}
.rating-text{font-size:12px;color:var(--gray)}
.rating-text strong{color:var(--black);font-weight:700}

/* SUCCESS STATE */
.success-screen{
  display:none;text-align:center;padding:60px 36px;
}
.success-screen.show{display:block}
.form-content.hide{display:none}
.success-icon{font-size:56px;margin-bottom:20px}
.success-screen h2{font-size:24px;font-weight:800;color:var(--black);margin-bottom:12px}
.success-screen p{font-size:15px;color:var(--gray);line-height:1.65;max-width:360px;margin:0 auto 28px}

/* ═══════ MOBILE ═══════ */
@media(max-width:768px){
  nav{padding:0 16px;height:64px;width:100%}
  .nav-links{display:none}
  .btn-back{font-size:12px;padding:7px 14px}
  .page-hero{padding:28px 16px 24px;width:100%}
  .page-hero h1{font-size:22px;letter-spacing:-.5px}
  .page-hero p{font-size:13px}
  .main-grid{
    display:block;
    padding:16px;
    width:100%;
    max-width:100%;
  }
  .sidebar{display:none}
  .form-card{
    padding:18px 14px;
    border-radius:14px;
    width:100%;
    margin-bottom:80px;
  }
  .section-title{font-size:12px;margin-bottom:10px}
  .section-num{width:20px;height:20px;font-size:10px}
  .option-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    width:100%;
  }
  .opt-btn{
    padding:11px 8px;
    font-size:12px;
    justify-content:flex-start;
    border-radius:10px;
    width:100%;
  }
  .opt-icon{font-size:15px}
  .field-row{grid-template-columns:1fr;gap:10px}
  .field-row.three{grid-template-columns:1fr 1fr;gap:8px}
  .field-input{font-size:16px!important;padding:12px 14px;width:100%}
  .field-single{width:100%}
  .rooms-row{gap:8px;flex-wrap:wrap}
  .room-btn{width:50px;height:50px;font-size:16px}
  .upload-area{padding:18px 14px}
  .submit-btn{font-size:14px;padding:15px;border-radius:14px}
  .section-divider{margin:18px 0}
  .form-note{font-size:11px}
}
@media(max-width:400px){
  .option-grid{grid-template-columns:1fr}
  .main-grid{padding:12px}
  .form-card{padding:16px 12px}
}

/* ── OPTION BUTTONS — definitive ── */
.opt-btn {
  display:flex;align-items:center;gap:8px;
  padding:12px 20px;border-radius:12px;
  border:2px solid #e4e4e0;background:#ffffff;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:13px;font-weight:500;color:#1e1e1e;
  cursor:pointer;user-select:none;
  position:relative;
  transition:border-color .15s, color .15s;
}
.opt-btn:not(.active):not(.active-teal):hover {
  border-color:#E57689;
  color:#E57689;
}
.opt-btn.active,
.opt-btn.active:hover,
.opt-btn.active:focus {
  border-color:#E57689 !important;
  background:#E57689 !important;
  color:#ffffff !important;
  font-weight:700 !important;
  box-shadow:0 4px 16px rgba(229,118,137,0.35) !important;
}
.opt-btn.active-teal,
.opt-btn.active-teal:hover,
.opt-btn.active-teal:focus {
  border-color:#88CDCA !important;
  background:#88CDCA !important;
  color:#ffffff !important;
  font-weight:700 !important;
  box-shadow:0 4px 16px rgba(136,205,202,0.35) !important;
}
.opt-btn.active::after {
  content:"✓";
  position:absolute;top:-7px;right:-7px;
  width:18px;height:18px;border-radius:50%;
  background:white;color:#E57689;
  font-size:10px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  border:2px solid #E57689;
}
.opt-btn.active-teal::after {
  content:"✓";
  position:absolute;top:-7px;right:-7px;
  width:18px;height:18px;border-radius:50%;
  background:white;color:#2a7a78;
  font-size:10px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  border:2px solid #88CDCA;
}

/* ── ROOM BUTTONS ── */
.room-btn {
  width:48px;height:48px;border-radius:12px;
  border:2px solid #e4e4e0;background:#ffffff;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:15px;font-weight:700;color:#6b6b6b;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:border-color .15s, color .15s;
}
.room-btn:not(.active):hover {
  border-color:#E57689;
  color:#E57689;
}
.room-btn.active,
.room-btn.active:hover,
.room-btn.active:focus {
  border-color:#E57689 !important;
  background:#E57689 !important;
  color:#ffffff !important;
  box-shadow:0 4px 14px rgba(229,118,137,0.35) !important;
}


/* Section highlight pulse */
@keyframes sectionPulse {
  0%   { box-shadow: 0 0 0 0 rgba(229,118,137,0); background: white; }
  30%  { box-shadow: 0 0 0 6px rgba(229,118,137,0.2); background: #fdf0f2; }
  100% { box-shadow: 0 0 0 0 rgba(229,118,137,0); background: white; }
}
.section-highlight {
  border-radius: 14px;
  animation: sectionPulse 1.4s ease forwards;
}
/* Auto-scroll indicator on rooms section num */
#rooms-section .section-num {
  transition: transform .2s, background .2s;
}
.section-highlight .section-num {
  transform: scale(1.15);
  background: var(--pink) !important;
}