/*
Theme Name: Salon Natali
Theme URI: https://salonnatali.cz/
Author: Salon Natali
Description: Vlastní WordPress šablona vytvořená z původního index.html.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: salon-natali
*/


  :root{
    --ink:#2b1620;
    --wine:#6b2737;
    --wine-dark:#4a1b27;
    --wine-deep:#341019;
    --blush:#f0d9d6;
    --blush-soft:#f8efec;
    --ivory:#fbf7f2;
    --gold:#b9925a;
    --gold-light:#e4cfa4;
    --line: rgba(185,146,90,.35);
    --shadow: 0 20px 50px -20px rgba(43,22,32,.35);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--ivory);
    color:var(--ink);
    font-family:'Work Sans', sans-serif;
    font-weight:400;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.display{
    font-family:'Fraunces', serif;
    font-weight:450;
    letter-spacing:-0.01em;
    margin:0;
    color:var(--wine-deep);
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
  .eyebrow{
    font-family:'Work Sans',sans-serif;
    text-transform:uppercase;
    letter-spacing:.22em;
    font-size:.72rem;
    font-weight:600;
    color:var(--wine);
  }
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:14px 30px;
    border-radius:999px;
    font-size:.85rem;
    font-weight:600;
    letter-spacing:.03em;
    cursor:pointer;
    border:1px solid transparent;
    transition:transform .35s ease, box-shadow .35s ease, background .35s ease, color .35s ease;
  }
  .btn-solid{background:var(--wine); color:var(--ivory);}
  .btn-solid:hover{background:var(--wine-deep); transform:translateY(-2px); box-shadow:var(--shadow);}
  .btn-line{border-color:var(--gold); color:var(--wine-deep);}
  .btn-line:hover{background:var(--blush-soft); transform:translateY(-2px);}
  .btn-ghost{color:var(--ivory); border-color:rgba(251,247,242,.4);}
  .btn-ghost:hover{background:rgba(251,247,242,.12);}

  /* flourish */
  .sprig{width:46px;height:auto;color:var(--gold);flex:none;}
  .sprig path{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;}
  .divider{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 auto 18px;color:var(--gold);}
  .divider .sprig{width:34px;}
  .divider::before,.divider::after{content:"";height:1px;width:64px;background:var(--line);}

  /* header */
  header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    padding:20px 0;
    transition:background .4s ease, padding .4s ease, box-shadow .4s ease;
  }
  header.scrolled{background:rgba(251,247,242,.92);backdrop-filter:blur(10px);padding:12px 0;box-shadow:0 6px 24px -12px rgba(43,22,32,.25);}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;}
  .logo{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-size:1.4rem;letter-spacing:.03em;color:var(--ivory);transition:color .4s ease;}
  header.scrolled .logo{color:var(--wine-deep);}
  .logo .sprig{width:26px;color:var(--gold-light);}
  header.scrolled .logo .sprig{color:var(--gold);}
  nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:0;}
  nav a{font-size:.85rem;font-weight:500;letter-spacing:.02em;color:rgba(251,247,242,.88);transition:color .3s ease;position:relative;}
  header.scrolled nav a{color:var(--ink);}
  nav a:hover{color:var(--gold-light);}
  header.scrolled nav a:hover{color:var(--wine);}
  .nav-right{display:flex;align-items:center;gap:22px;}
  .burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;}
  .burger span{width:24px;height:2px;background:var(--ivory);transition:.3s;}
  header.scrolled .burger span{background:var(--wine-deep);}

  /* hero */
  .hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    background:radial-gradient(120% 120% at 82% 10%, #7c3247 0%, var(--wine) 42%, var(--wine-deep) 100%);
    overflow:hidden;
    padding:140px 0 90px;
  }
  .hero::before{
    content:"";
    position:absolute;inset:0;
    background:
      radial-gradient(circle at 12% 85%, rgba(228,207,164,.14), transparent 45%),
      radial-gradient(circle at 90% 78%, rgba(228,207,164,.10), transparent 40%);
    pointer-events:none;
  }
  .hero-grid{
    position:relative;z-index:2;
    display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center;
  }
  .hero .eyebrow{color:var(--gold-light);}
  .hero h1{
    color:var(--ivory);
    font-size:clamp(3rem,6.6vw,5.6rem);
    line-height:.98;
    margin:18px 0 26px;
  }
  .hero h1 em{font-style:italic;color:var(--gold-light);font-weight:400;}
  .hero p.lede{
    color:rgba(251,247,242,.82);
    font-size:1.08rem;
    max-width:480px;
    margin-bottom:36px;
  }
  .hero-ctas{display:flex;gap:16px;flex-wrap:wrap;}
  .hero-collage{position:relative;height:520px;}
  .hero-collage img{
    position:absolute;
    border-radius:6px;
    object-fit:cover;
    box-shadow:0 30px 60px -25px rgba(0,0,0,.55);
    border:6px solid rgba(251,247,242,.9);
  }
  .hc1{width:62%;height:60%;top:0;right:0;}
  .hc2{width:52%;height:46%;bottom:0;left:0;z-index:2;}
  .hc-tag{
    position:absolute; left:6%; top:44%;
    background:var(--ivory); color:var(--wine-deep);
    padding:16px 20px; border-radius:6px; box-shadow:var(--shadow);
    font-family:'Fraunces',serif; z-index:3; max-width:200px;
  }
  .hc-tag .num{font-size:1.6rem; display:block;}
  .hc-tag .lbl{font-family:'Work Sans',sans-serif; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--wine);}
  .scroll-cue{
    position:absolute; bottom:34px; left:50%; transform:translateX(-50%);
    display:flex;flex-direction:column;align-items:center;gap:8px;
    color:rgba(251,247,242,.7); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; z-index:2;
  }
  .scroll-cue .stick{width:1px;height:34px;background:linear-gradient(rgba(251,247,242,.9),transparent);animation:down 1.8s infinite;}
  @keyframes down{0%{transform:scaleY(0);transform-origin:top;}50%{transform:scaleY(1);transform-origin:top;}50.1%{transform-origin:bottom;}100%{transform:scaleY(0);transform-origin:bottom;}}

  section{padding:110px 0;}
  .section-head{text-align:center;max-width:640px;margin:0 auto 56px;}
  .section-head h2{font-size:clamp(2.1rem,3.6vw,3rem);margin-top:14px;}
  .section-head p{margin-top:16px;color:#5c3f47;font-size:1.02rem;}

  /* about */
  .about{background:var(--ivory);}
  .about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center;}
  .about-photo{position:relative;}
  .about-photo img{border-radius:6px;width:100%;height:520px;object-fit:cover;box-shadow:var(--shadow);}
  .about-photo::after{
    content:"";position:absolute;inset:22px -22px -22px 22px;
    border:1.5px solid var(--gold); border-radius:6px; z-index:-1;
  }
  .about-copy p{font-size:1.06rem;color:#4a2c33;margin-bottom:20px;}
  .about-facts{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:34px;}
  .fact{border-top:1px solid var(--line);padding-top:14px;}
  .fact .fnum{font-family:'Fraunces',serif;font-size:1.6rem;color:var(--wine);}
  .fact .flbl{font-size:.82rem;color:#6d4b53;}

  /* packages */
  .packages{background:var(--blush-soft);}
  .pack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
  .pack-card{
    background:var(--ivory);
    border-radius:10px;
    padding:38px 32px;
    box-shadow:0 16px 40px -24px rgba(43,22,32,.3);
    position:relative;
    border:1px solid rgba(185,146,90,.25);
    display:flex;flex-direction:column;
  }
  .pack-card.featured{background:var(--wine); color:var(--ivory); transform:translateY(-14px); box-shadow:var(--shadow);}
  .pack-card.featured h3, .pack-card.featured .pack-price{color:var(--ivory);}
  .pack-card.featured .eyebrow{color:var(--gold-light);}
  .badge{
    position:absolute; top:-14px; right:28px;
    background:var(--gold); color:var(--wine-deep);
    font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
    padding:6px 14px; border-radius:999px;
  }
  .pack-card h3{font-size:1.5rem;margin:10px 0 4px;}
  .pack-price{font-family:'Fraunces',serif;font-size:2.2rem;color:var(--wine);margin:14px 0 4px;}
  .pack-dur{font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;opacity:.75;margin-bottom:22px;}
  .pack-card ul{list-style:none;margin:0 0 26px;padding:0;flex:1;}
  .pack-card li{
    padding:9px 0; border-top:1px dashed var(--line);
    font-size:.93rem;
  }
  .pack-card.featured li{border-top:1px dashed rgba(251,247,242,.28);}
  .pack-card li:first-child{border-top:none;}

  /* menu / cenik */
  .menu-section{background:var(--ivory);}
  .tabs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:48px;}
  .tab-btn{
    padding:10px 20px;border-radius:999px;border:1px solid var(--line);
    background:transparent;font-family:'Work Sans',sans-serif;font-size:.83rem;font-weight:500;
    color:#6d4b53;cursor:pointer;transition:all .3s ease;
  }
  .tab-btn:hover{border-color:var(--gold);color:var(--wine-deep);}
  .tab-btn.active{background:var(--wine);border-color:var(--wine);color:var(--ivory);}
  .menu-panel{display:none;max-width:820px;margin:0 auto;}
  .menu-panel.active{display:block;animation:fade .5s ease;}
  @keyframes fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
  .menu-item{
    display:flex;align-items:baseline;gap:12px;
    padding:16px 0; border-bottom:1px solid var(--line);
  }
  .menu-item .mi-name{font-family:'Fraunces',serif;font-size:1.08rem;color:var(--wine-deep);}
  .menu-item .mi-dur{font-size:.76rem;color:var(--gold);letter-spacing:.03em;margin-left:6px;white-space:nowrap;}
  .mi-leader{flex:1;border-bottom:1px dotted var(--line);height:0;transform:translateY(-6px);min-width:20px;}
  .mi-price{font-weight:600;color:var(--wine);white-space:nowrap;font-size:.96rem;}
  .mi-note{flex-basis:100%;font-size:.86rem;color:#6d4b53;margin-top:6px;line-height:1.55;}

  /* booking / rezervace */
  .booking-section{background:var(--blush-soft);}
  .booking-embed{
    max-width:820px;margin:0 auto;
    background:var(--ivory);
    border:1px solid var(--line);
    border-radius:10px;
    box-shadow:var(--shadow);
    padding:48px 40px;
    text-align:center;
  }
  /* Widen the booking widget on larger screens (PC) so the BookingPress
     plugin has more room and doesn't look cramped/narrow. */
  @media (min-width:981px){
    .booking-embed{
      max-width:1100px;
      padding:48px 56px;
    }
  }
  #bookingpress-container{
    max-width:100%;
    width:100%;
    margin:0 auto;
  }
  .booking-embed .bp-icon{
    width:52px;height:52px;margin:0 auto 18px;
    border-radius:50%;
    background:var(--blush-soft);
    display:flex;align-items:center;justify-content:center;
    color:var(--wine);
  }
  .booking-embed h3{font-size:1.35rem;margin-bottom:10px;}
  .booking-embed p{color:#6d4b53;font-size:.95rem;max-width:480px;margin:0 auto 22px;}
  .booking-embed code{
    display:block;background:var(--blush-soft);color:var(--wine-deep);
    padding:12px 16px;border-radius:6px;font-size:.82rem;
    border:1px dashed var(--gold);word-break:break-all;
  }
  /* BookingPress plugin injects its own markup here once the shortcode
     is placed on the live WordPress site - this styling keeps it inside
     the site's ivory/wine/gold theme via CSS variable overrides that
     BookingPress respects for buttons/links where possible. */
  #bookingpress-container .bookingpress_wizard_wrapper{font-family:'Work Sans',sans-serif;}

  /* reviews embed placeholder (dark, sits on --wine-deep background) */
  .reviews-embed{
    max-width:820px;margin:34px auto 0;
    background:rgba(251,247,242,.06);
    border:1px dashed rgba(251,247,242,.35);
    border-radius:10px;
    padding:44px 40px;
    text-align:center;
  }
  .reviews-embed .rv-icon{
    width:52px;height:52px;margin:0 auto 18px;
    border-radius:50%;
    background:rgba(251,247,242,.1);
    display:flex;align-items:center;justify-content:center;
    color:var(--gold-light);
  }
  .reviews-embed h3{color:var(--ivory);font-size:1.25rem;margin-bottom:10px;font-family:'Fraunces',serif;font-weight:450;}
  .reviews-embed p{color:rgba(251,247,242,.72);font-size:.92rem;max-width:480px;margin:0 auto 20px;}
  .reviews-embed code{
    display:block;background:rgba(251,247,242,.08);color:var(--gold-light);
    padding:12px 16px;border-radius:6px;font-size:.8rem;
    border:1px dashed rgba(228,207,164,.5);word-break:break-all;
  }
  #google-reviews-container{font-family:'Work Sans',sans-serif;}

  /* gallery */
  .gallery{background:var(--blush-soft);}
  .gal-grid{
    columns:4 220px; column-gap:16px;
  }
  .gal-grid img{
    width:100%;margin-bottom:16px;border-radius:6px;
    box-shadow:0 12px 28px -18px rgba(43,22,32,.4);
    transition:transform .5s ease, box-shadow .5s ease, filter .5s ease;
    cursor:pointer;
    filter:saturate(.92);
  }
  .gal-grid img:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 26px 40px -20px rgba(43,22,32,.45);filter:saturate(1.05);}

  /* social proof */
  .proof{background:var(--wine-deep);color:var(--ivory);text-align:center;}
  .proof .divider{color:var(--gold-light);}
  .proof .divider::before,.proof .divider::after{background:rgba(251,247,242,.28);}
  .proof h2{color:var(--ivory);}
  .proof p{max-width:560px;margin:18px auto 34px;color:rgba(251,247,242,.78);}
  .stars{letter-spacing:6px;color:var(--gold-light);font-size:1.3rem;margin-bottom:10px;}

  /* contact */
  .contact{background:var(--ivory);}
  .contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:stretch;}
  .contact-card{
    background:var(--wine); color:var(--ivory);
    border-radius:10px; padding:44px 38px;
    display:flex;flex-direction:column;gap:22px;
    box-shadow:var(--shadow);
  }
  .contact-card h3{color:var(--ivory);font-size:1.6rem;}
  .c-row{display:flex; gap:14px; align-items:flex-start; font-size:.95rem;}
  .c-row .sprig{width:20px;color:var(--gold-light);margin-top:2px;}
  .c-row a{border-bottom:1px solid rgba(251,247,242,.4);}
  .c-row a:hover{border-color:var(--gold-light);color:var(--gold-light);}
  .social-row{display:flex;gap:14px;margin-top:auto;}
  .social-row a{
    width:40px;height:40px;border-radius:50%;border:1px solid rgba(251,247,242,.4);
    display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:.3s;
  }
  .social-row a:hover{background:var(--gold-light);color:var(--wine-deep);border-color:var(--gold-light);}
  .map-wrap{border-radius:10px;overflow:hidden;box-shadow:var(--shadow);min-height:340px;}
  .map-wrap iframe{width:100%;height:100%;min-height:340px;border:0;display:block;}

  footer{
    background:var(--wine-deep); color:rgba(251,247,242,.65);
    padding:38px 0; text-align:center; font-size:.82rem; letter-spacing:.04em;
  }
  footer .sprig{width:22px;color:var(--gold-light);margin:0 auto 12px;}

  @media (max-width:980px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-collage{height:380px;margin-top:20px;}
    .about-grid, .contact-grid{grid-template-columns:1fr;}
    .about-photo img{height:360px;}
    .pack-grid{grid-template-columns:1fr;}
    .pack-card.featured{transform:none;}
    nav ul{display:none;}
    .burger{display:flex;}
  }
  @media (max-width:600px){
    .wrap{padding:0 20px;}
    section{padding:80px 0;}
    .gal-grid{columns:2 160px;}
    .hc-tag{display:none;}
  }
  @media (prefers-reduced-motion: reduce){
    *{animation:none !important; transition:none !important;}
  }

