
:root{
  --bg:#f7f1e9;
  --paper:#fffdf9;
  --ink:#20191b;
  --rose:#b57b86;
  --gold:#c6a36b;
  --green:#20864b;
  --red:#aa3f46;
  --line:rgba(55,37,42,.13);
  --serif:"Cormorant Garamond",serif;
  --sans:"Montserrat",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at top left,#fffaf2,#f4ede5 52%,#f8f3ed);color:var(--ink);font-family:var(--sans)}
button,input,select,textarea{font:inherit}
a{text-decoration:none;color:inherit}

.reservation-header{
  position:sticky;top:0;z-index:40;height:86px;padding:0 max(22px,calc((100vw - 1230px)/2));
  display:flex;align-items:center;justify-content:space-between;background:rgba(255,253,249,.92);
  backdrop-filter:blur(18px);border-bottom:1px solid var(--line)
}
.reservation-brand{display:flex;align-items:center;gap:11px}
.brand-mark{width:42px;height:42px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;font:600 21px var(--serif)}
.reservation-brand strong{display:block;font:600 24px/1 var(--serif)}
.reservation-brand small{display:block;margin-top:5px;font-size:7px;letter-spacing:.22em}
.home-button{padding:13px 19px;border-radius:999px;background:var(--ink);color:#fff;font-size:11px;font-weight:700}

.reservation-shell{width:min(1190px,calc(100% - 34px));margin:0 auto;padding:48px 0 80px}
.reservation-title{margin-bottom:24px}
.reservation-title>span{font-size:9px;font-weight:700;letter-spacing:.22em;color:var(--gold)}
.reservation-title h1{margin:8px 0 7px;font:600 clamp(50px,6vw,78px)/.95 var(--serif)}
.reservation-title p{font-size:13px;color:#756a6c;line-height:1.6}

.form-card,.summary-card{
  margin-top:18px;padding:26px;border-radius:28px;background:rgba(255,253,249,.92);
  border:1px solid var(--line);box-shadow:0 18px 50px rgba(63,42,47,.06)
}
.card-title{display:flex;align-items:center;gap:12px;margin-bottom:23px}
.card-title>span{width:36px;height:36px;border-radius:12px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700}
.card-title h2{margin:0;font:600 33px/1 var(--serif)}

.field{display:block;margin-top:15px}
.field>span{display:block;margin-bottom:8px;font-size:10px;font-weight:700}
.field input,.field select,.field textarea{
  width:100%;border:1px solid #e4d8c6;border-radius:16px;background:#fff;padding:15px 16px;outline:none;
  transition:.2s
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--rose);box-shadow:0 0 0 4px rgba(181,123,134,.10)}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.full{grid-column:1/-1}
.schedule-note{margin:9px 0 0;font-size:10px;color:#7c7072}
.availability-state{margin-top:18px;padding:15px 16px;border-radius:15px;font-size:11px;font-weight:700}
.availability-state.neutral{background:#f3ece7;color:#766a6d}
.availability-state.success{background:#dff6e8;color:#1a6d3b}
.availability-state.error{background:#f8e0e2;color:#8c2f37}

.slot-list{display:grid;gap:10px;margin-top:11px}
.slot-option{
  width:100%;padding:15px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;
  display:flex;align-items:center;justify-content:space-between;text-align:left;cursor:pointer
}
.slot-option strong{font-size:13px}
.slot-option span{padding:7px 10px;border-radius:999px;font-size:8px;font-weight:700}
.slot-option.available{border-color:#8de0aa;background:#f0fff5}
.slot-option.available span{background:var(--green);color:#fff}
.slot-option.busy{opacity:.48;cursor:not-allowed}
.slot-option.busy span{background:#ddd;color:#666}
.slot-option.selected{outline:3px solid rgba(32,134,75,.16);border-color:var(--green)}

.package-options{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.package-option{
  border:1px solid #e4d8c6;border-radius:18px;background:#fff;padding:18px;text-align:left;cursor:pointer;
  transition:.2s
}
.package-option:hover{transform:translateY(-2px)}
.package-option.featured{background:#2d2426;color:#fff;border-color:#2d2426}
.package-option.selected{outline:3px solid rgba(181,123,134,.25);border-color:var(--rose)}
.package-option-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.package-option-head small{display:block;font-size:8px;letter-spacing:.14em;color:var(--gold);font-weight:700}
.package-option-head strong{display:block;margin-top:7px;font:600 27px/1 var(--serif)}
.package-option-head b{font-size:14px;white-space:nowrap}
.campaign-line{display:block;margin-top:10px;font-size:9px;color:#d5ad75;font-weight:700}
.package-preview{display:block;margin-top:11px;font-size:9px;line-height:1.6;opacity:.64}

.payment-description{font-size:12px;color:#74696b;line-height:1.7}
.bank-panel{margin-top:18px;padding:20px;border-radius:18px;background:#1f181a;color:#fff;display:grid;gap:11px}
.bank-panel p{margin:0;display:flex;gap:7px;font-size:11px}
.bank-panel span{color:#e2bc70;font-weight:700}
.payment-buttons{display:flex;gap:10px;margin-top:15px}
.payment-buttons button,.payment-buttons a{
  min-height:45px;padding:0 17px;border-radius:999px;border:0;display:inline-flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700
}
.payment-buttons button{background:var(--ink);color:#fff;cursor:pointer}
.payment-buttons a{background:#f1d99d;color:#30251f}
.copy-message{min-height:18px;margin-top:8px;color:var(--green);font-size:10px;font-weight:700}
.receipt-info{margin-top:12px;padding:16px;border:1px solid #dfc276;border-radius:16px;background:#fff8e7}
.receipt-info strong{font-size:11px}
.receipt-info p{margin:7px 0 0;font-size:10px;line-height:1.6}

.summary-card{background:#1f181a;color:#fff}
.summary-row{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:11px}
.summary-card>button{
  width:100%;min-height:50px;margin-top:17px;border:0;border-radius:999px;background:linear-gradient(135deg,#fff2c9,#ecd390);
  color:#251b19;font-size:10px;font-weight:700;cursor:pointer
}

.contract-modal{
  position:fixed;inset:0;z-index:100;background:rgba(28,21,23,.72);backdrop-filter:blur(10px);
  display:grid;place-items:center;padding:18px;opacity:0;pointer-events:none;transition:.2s
}
.contract-modal.open{opacity:1;pointer-events:auto}
.contract-dialog{position:relative;width:min(720px,100%);max-height:90vh;overflow:auto;border-radius:26px;background:#fffdf9;padding:28px}
.contract-close{position:absolute;right:17px;top:13px;border:0;background:none;font-size:31px;cursor:pointer}
.contract-kicker{font-size:8px;letter-spacing:.18em;color:var(--gold);font-weight:700}
.contract-dialog h2{margin:8px 0 17px;font:600 39px/1 var(--serif)}
.contract-scroll{max-height:340px;overflow:auto;padding:18px;border:1px solid var(--line);border-radius:16px;background:#faf5ef}
.contract-scroll p{font-size:11px;line-height:1.75;color:#62585a}
.contract-check{display:flex;gap:10px;align-items:flex-start;margin-top:13px;font-size:10px;line-height:1.5}
.contract-submit{width:100%;min-height:49px;margin-top:17px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-size:10px;font-weight:700;cursor:pointer}

@media(max-width:700px){
  .reservation-header{height:72px;padding:0 16px}
  .reservation-brand strong{font-size:20px}
  .brand-mark{width:38px;height:38px}
  .home-button{padding:11px 14px;font-size:9px}

  .reservation-shell{width:calc(100% - 20px);padding:29px 0 65px}
  .reservation-title{padding:0 6px}
  .reservation-title h1{font-size:47px}
  .reservation-title p{font-size:11px}

  .form-card,.summary-card{padding:18px;border-radius:22px}
  .card-title h2{font-size:29px}
  .field-grid,.package-options{grid-template-columns:1fr}
  .field input,.field select,.field textarea{padding:14px}
  .package-option-head strong{font-size:25px}
  .payment-buttons{display:grid}
  .payment-buttons button,.payment-buttons a{width:100%}
  .bank-panel p{display:block}
  .bank-panel p span{display:block;margin-bottom:3px}
  .contract-dialog{padding:22px 18px}
}


/* Premium kampanya vurgusu */
.campaign-box{
  display:block;
  margin-top:14px;
  padding:14px 15px;
  border-radius:15px;
  background:linear-gradient(135deg,#f4ddb2,#e7c38f);
  color:#332421;
  box-shadow:0 10px 26px rgba(122,83,42,.16);
}
.campaign-box small{
  display:block;
  font-size:8px;
  font-weight:800;
  letter-spacing:.12em;
}
.campaign-box strong{
  display:block;
  margin-top:6px;
  font:600 23px/1.05 var(--serif);
}
.campaign-box em{
  display:inline-flex;
  margin-top:9px;
  padding:6px 9px;
  border-radius:999px;
  background:#2c2224;
  color:#fff;
  font-style:normal;
  font-size:8px;
  font-weight:700;
}
.package-option.featured .package-option-head b{
  display:none;
}

@media(max-width:700px){
  .campaign-box{
    padding:13px;
  }
  .campaign-box strong{
    font-size:21px;
  }
}


/* Paket içerikleri */
.package-content-title{
  display:block;
  margin-top:15px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.13em;
  color:var(--gold);
  text-transform:uppercase;
}
.package-content-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 14px;
  margin-top:10px;
}
.package-content-item{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:7px 0;
  border-bottom:1px solid rgba(65,44,49,.09);
  font-size:9px;
  line-height:1.45;
}
.package-option.featured .package-content-item{
  border-bottom-color:rgba(255,255,255,.10);
}
.package-content-item b{
  color:var(--gold);
  flex:0 0 auto;
  font-size:10px;
}
.package-option{
  min-height:100%;
}
.package-option.selected{
  box-shadow:0 18px 40px rgba(94,58,68,.12);
}

@media(max-width:700px){
  .package-content-list{
    grid-template-columns:1fr;
    gap:4px;
  }
  .package-content-item{
    font-size:9.5px;
  }
}


/* Paket kartları temiz görünüm V4 */
.package-option{
  position:relative;
  overflow:hidden;
  padding:20px;
}

.package-option-head{
  align-items:center;
}

.package-preview-list{
  display:grid;
  gap:8px;
  margin-top:16px;
}

.package-preview-list>span{
  display:flex;
  align-items:flex-start;
  gap:8px;
  font-size:10px;
  line-height:1.45;
  opacity:.82;
}

.package-preview-list b,
.package-detail-panel b{
  color:var(--gold);
  flex:0 0 auto;
}

.package-detail-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:17px;
  padding-top:14px;
  border-top:1px solid rgba(65,44,49,.10);
  font-size:9px;
  font-weight:800;
  cursor:pointer;
  user-select:none;
}

.package-option.featured .package-detail-toggle{
  border-top-color:rgba(255,255,255,.12);
}

.package-detail-toggle b{
  width:24px;
  height:24px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#f1e4df;
  color:#7e5660;
  font-size:15px;
  transition:.2s;
}

.package-option.featured .package-detail-toggle b{
  background:rgba(255,255,255,.10);
  color:#e5c18d;
}

.package-detail-toggle.open b{
  transform:rotate(45deg);
}

.package-detail-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px 14px;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transition:max-height .32s ease, opacity .25s ease, margin-top .25s ease;
}

.package-detail-panel.open{
  max-height:800px;
  opacity:1;
  margin-top:14px;
}

.package-detail-panel>span{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:6px 0;
  font-size:9px;
  line-height:1.45;
}

.campaign-box{
  margin-top:16px;
}

@media(max-width:700px){
  .package-detail-panel{
    grid-template-columns:1fr;
  }

  .package-option{
    padding:18px;
  }

  .package-preview-list>span,
  .package-detail-panel>span{
    font-size:9.5px;
  }
}


/* V6 fiyat ve davetiye düzeni */
.campaign-box.refined{
  margin-top:16px;
  padding:18px 20px;
  border:1px solid rgba(198,163,107,.42);
  background:linear-gradient(135deg,rgba(255,247,228,.98),rgba(241,221,184,.95));
  color:#342527;
  box-shadow:0 14px 34px rgba(116,79,45,.12);
}
.campaign-box.refined small{
  display:block;
  font-family:var(--sans);
  font-size:8px;
  line-height:1.4;
  font-weight:800;
  letter-spacing:.16em;
  color:#7c5d3b;
}
.campaign-box.refined strong{
  display:block;
  margin-top:9px;
  font-family:var(--serif);
  font-size:38px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.02em;
}
.campaign-box.refined>span{
  display:block;
  margin-top:9px;
  font-family:var(--sans);
  font-size:9px;
  line-height:1.5;
  color:#6f5d55;
  font-weight:600;
}
.invitation-card{
  background:
    radial-gradient(circle at top right,rgba(230,201,186,.22),transparent 35%),
    rgba(255,253,249,.96);
}
.section-help{
  margin:-8px 0 20px;
  font-size:10px;
  line-height:1.6;
  color:#7a6d70;
}
.invitation-card .field>span{
  font-size:9px;
  letter-spacing:.02em;
}
.invitation-card input,
.invitation-card textarea{
  background:#fffefa;
}
@media(max-width:700px){
  .campaign-box.refined strong{font-size:34px}
  .section-help{font-size:9.5px}
}


/* Tam sözleşme V7 */
.contract-instruction{
  margin:-8px 35px 16px 0;
  color:#786b6d;
  font-size:9px;
  line-height:1.55;
}
.contract-scroll{
  max-height:52vh;
  scroll-behavior:smooth;
}
.contract-document{
  color:#332a2c;
}
.contract-document>h3{
  margin:0 0 22px;
  text-align:center;
  font-family:var(--serif);
  font-size:25px;
  letter-spacing:.03em;
}
.contract-document section{
  margin-top:22px;
}
.contract-document h4{
  margin:0 0 10px;
  padding-bottom:7px;
  border-bottom:1px solid rgba(59,40,45,.14);
  font-family:var(--sans);
  font-size:10px;
  line-height:1.4;
  letter-spacing:.08em;
  color:#5d4047;
}
.contract-document h5{
  margin:16px 0 7px;
  font-family:var(--sans);
  font-size:10px;
  color:#3d3033;
}
.contract-document p,
.contract-document li{
  font-family:var(--sans);
  font-size:9.5px;
  line-height:1.75;
  color:#574d4f;
}
.contract-document p{
  margin:8px 0;
}
.contract-document ol,
.contract-document ul{
  margin:7px 0 0;
  padding-left:19px;
}
.contract-document li{
  margin:6px 0;
}
.contract-document li>ul{
  margin-top:8px;
  padding:12px 12px 12px 27px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(59,40,45,.10);
}
.contract-summary-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:12px;
}
.contract-summary-grid p{
  margin:0;
  padding:11px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(59,40,45,.10);
}
.contract-summary-grid span{
  display:block;
  margin-bottom:4px;
  font-size:7.5px;
  font-weight:700;
  letter-spacing:.08em;
  color:#a17768;
  text-transform:uppercase;
}
.contract-summary-grid strong{
  font-size:9.5px;
  color:#352a2d;
}
.contract-check input:disabled + span{
  opacity:.45;
}
.contract-submit:disabled{
  opacity:.42;
  cursor:not-allowed;
}
@media(max-width:700px){
  .contract-dialog h2{
    font-size:33px;
  }
  .contract-scroll{
    max-height:55vh;
  }
  .contract-summary-grid{
    grid-template-columns:1fr;
  }
  .contract-document p,
  .contract-document li{
    font-size:9px;
  }
}


/* Hafta içi / hafta sonu fiyat göstergesi V8 */
.price-period-badge{
  display:inline-flex;
  width:max-content;
  margin-top:14px;
  padding:7px 10px;
  border-radius:999px;
  background:#f2e8e4;
  color:#845e66;
  font-size:7.5px;
  line-height:1;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.package-option.featured .price-period-badge{
  background:rgba(255,255,255,.09);
  color:#e5c38f;
}
.campaign-box.refined .campaign-current-price{
  font-size:40px;
}
@media(max-width:700px){
  .price-period-badge{margin-top:12px}
  .campaign-box.refined .campaign-current-price{font-size:35px}
}


/* Yazılı sözleşme onayı V11 */
.typed-confirmation{
  margin-top:15px;
  padding:16px;
  border:1px solid rgba(59,40,45,.12);
  border-radius:16px;
  background:#faf6f2;
}
.typed-confirmation label{
  display:block;
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6d4f56;
}
.typed-confirmation p{
  margin:7px 0 11px;
  font-size:9px;
  line-height:1.55;
  color:#655a5c;
}
.typed-confirmation input{
  width:100%;
  min-height:47px;
  padding:0 14px;
  border:1px solid rgba(59,40,45,.15);
  border-radius:12px;
  background:#fff;
  outline:none;
  font-family:var(--sans);
  font-size:10px;
  transition:.2s;
}
.typed-confirmation input:focus{
  border-color:#b57d88;
  box-shadow:0 0 0 4px rgba(181,125,136,.10);
}
.typed-confirmation input:disabled{
  opacity:.55;
  cursor:not-allowed;
}
.typed-confirmation input.is-valid{
  border-color:#55a87a;
  background:#f3fbf6;
}
.typed-confirmation input.is-invalid{
  border-color:#c46c75;
  background:#fff7f8;
}
.typed-confirmation small{
  display:block;
  margin-top:8px;
  font-size:8px;
  line-height:1.45;
  color:#8b7d80;
}
.typed-confirmation small.is-valid{color:#278754}
.typed-confirmation small.is-invalid{color:#aa4650}
