/*
Theme Name: Grand Lux MB
Theme URI: https://grandluxmb.rs
Author: Grand Lux MB
Author URI: https://grandluxmb.rs
Description: Restoran & Salon za proslave - Svilajnac, Est. 2008. Luxury dark theme sa zlatnim akcentima.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: grand-lux-mb
Tags: restaurant, one-page, custom-menu, featured-images
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
*/

:root{
    --bg:#0a0a0a;
    --bg-2:#121212;
    --bg-3:#1a1612;
    --gold:#c9a961;
    --gold-bright:#e8c573;
    --gold-deep:#8a7339;
    --gold-line:rgba(201,169,97,.25);
    --text:#ede7d9;
    --text-mute:#9a9388;
    --serif:'Cormorant Garamond', 'Times New Roman', serif;
    --sans:'Outfit', system-ui, sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:var(--sans);
    font-weight:300;
    line-height:1.6;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
  }
  body::before{
    content:'';
    position:fixed;inset:0;
    background:
      radial-gradient(ellipse at 20% 10%, rgba(201,169,97,.08), transparent 50%),
      radial-gradient(ellipse at 80% 90%, rgba(201,169,97,.05), transparent 50%);
    pointer-events:none;z-index:0;
  }
  body::after{
    content:'';position:fixed;inset:0;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
    opacity:.04;pointer-events:none;z-index:1;mix-blend-mode:overlay;
  }
  main, nav, header, section, footer{position:relative;z-index:2}

  /* ===== NAV ===== */
  nav{
    position:fixed;top:0;left:0;right:0;
    padding:1.2rem 2rem;
    display:flex;justify-content:space-between;align-items:center;
    z-index:100;
    background:rgba(10,10,10,.6);
    backdrop-filter:blur(20px);
    border-bottom:1px solid transparent;
    transition:all .4s ease;
  }
  nav.scrolled{
    background:rgba(10,10,10,.92);
    border-bottom-color:var(--gold-line);
    padding:.9rem 2rem;
  }
  .nav-logo{
    font-family:var(--serif);
    font-size:1.4rem;
    letter-spacing:.15em;
    color:var(--gold);
    text-transform:uppercase;
    font-weight:500;
    z-index:102;
  }
  .nav-logo span{color:var(--gold-bright);font-style:italic;font-weight:400}
  .nav-links{display:flex;gap:2.2rem;list-style:none}
  .nav-links a{
    color:var(--text);text-decoration:none;
    font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
    font-weight:300;position:relative;padding:.3rem 0;
    transition:color .3s;
  }
  .nav-links a::after{
    content:'';position:absolute;bottom:0;left:50%;
    width:0;height:1px;background:var(--gold);
    transition:all .3s ease;
  }
  .nav-links a:hover{color:var(--gold-bright)}
  .nav-links a:hover::after{width:100%;left:0}
  .burger{display:none;background:none;border:none;color:var(--gold);cursor:pointer;padding:.5rem}
  .burger svg{width:28px;height:28px}

  /* ===== HERO ===== */
  .hero{
    min-height:100vh;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;padding:7rem 2rem 7rem;
    position:relative;
  }
  .hero-ornament{
    display:flex;align-items:center;gap:1rem;
    color:var(--gold);font-family:var(--serif);font-style:italic;
    font-size:.95rem;letter-spacing:.3em;text-transform:uppercase;
    margin-bottom:2rem;opacity:0;
    animation:fadeUp 1s .3s forwards;
  }
  .hero-ornament::before,.hero-ornament::after{
    content:'';width:60px;height:1px;background:var(--gold-line);
  }
  .hero h1{
    font-family:var(--serif);
    font-size:clamp(3rem, 9vw, 7rem);
    font-weight:400;
    line-height:1;
    letter-spacing:.02em;
    color:var(--gold-bright);
    margin-bottom:.5rem;
    opacity:0;animation:fadeUp 1s .5s forwards;
  }
  .hero h1 em{font-style:italic;color:var(--gold);font-weight:300}
  .hero-sub{
    font-family:var(--serif);font-style:italic;
    font-size:clamp(1.1rem,2.5vw,1.6rem);
    color:var(--text-mute);
    margin-bottom:3rem;
    opacity:0;animation:fadeUp 1s .7s forwards;
  }
  .hero-meta{
    display:flex;gap:2.5rem;flex-wrap:wrap;justify-content:center;
    margin-bottom:3rem;max-width:600px;
    opacity:0;animation:fadeUp 1s .9s forwards;
  }
  .hero-meta > div{min-width:100px}
  .hero-meta div{text-align:center}
  .hero-meta .num{
    font-family:var(--serif);font-size:2.2rem;color:var(--gold);
    font-weight:400;display:block;line-height:1;
  }
  .hero-meta .lbl{
    font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;
    color:var(--text-mute);margin-top:.5rem;display:block;
  }
  .hero-cta{
    display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;
    max-width:520px;
    opacity:0;animation:fadeUp 1s 1.1s forwards;
  }
  .hero-cta .btn{flex:1 1 auto;min-width:200px;text-align:center}
  .btn{
    padding:1rem 2.5rem;
    font-family:var(--sans);font-size:.78rem;letter-spacing:.25em;
    text-transform:uppercase;text-decoration:none;
    cursor:pointer;border:none;
    transition:all .4s ease;
    display:inline-block;
  }
  .btn-gold{
    background:linear-gradient(135deg,var(--gold) 0%,var(--gold-bright) 100%);
    color:#0a0a0a;font-weight:500;
  }
  .btn-gold:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 30px rgba(201,169,97,.3);
  }
  .btn-ghost{
    background:transparent;color:var(--gold);
    border:1px solid var(--gold);font-weight:300;
  }
  .btn-ghost:hover{background:var(--gold);color:#0a0a0a}

  .scroll-indicator{
    position:absolute;bottom:1.2rem;left:50%;transform:translateX(-50%);
    color:var(--gold);font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;
    opacity:0;animation:fadeIn 1s 1.5s forwards;
    pointer-events:none;
  }
  .scroll-indicator::after{
    content:'';display:block;width:1px;height:30px;
    background:linear-gradient(to bottom,var(--gold),transparent);
    margin:.6rem auto 0;animation:scrollDown 2s ease infinite;
  }
  @media(max-height:760px),(max-width:600px){
    .scroll-indicator{display:none}
  }

  /* ===== SECTIONS BASE ===== */
  section{padding:7rem 2rem;max-width:1300px;margin:0 auto}
  .eyebrow{
    color:var(--gold);font-family:var(--serif);font-style:italic;
    font-size:1rem;letter-spacing:.3em;text-transform:uppercase;
    display:flex;align-items:center;gap:1rem;margin-bottom:1.2rem;
  }
  .eyebrow::before{content:'';width:40px;height:1px;background:var(--gold)}
  h2{
    font-family:var(--serif);font-weight:400;
    font-size:clamp(2.2rem,5vw,3.8rem);
    line-height:1.05;color:var(--text);
    margin-bottom:1.5rem;letter-spacing:.01em;
  }
  h2 em{color:var(--gold);font-style:italic}
  .lead{
    font-family:var(--serif);font-size:1.3rem;font-style:italic;
    color:var(--text-mute);max-width:600px;line-height:1.5;
  }

  /* ===== O NAMA ===== */
  .about{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
  .about-img{
    aspect-ratio:4/5;
    background:linear-gradient(135deg,#1a1612 0%,#2a2218 100%);
    border:1px solid var(--gold-line);
    position:relative;overflow:hidden;
    display:flex;align-items:center;justify-content:center;
  }
  .about-img::before{
    content:'';position:absolute;inset:1rem;
    border:1px solid var(--gold-line);
  }
  .about-img-label{
    color:var(--gold-deep);font-family:var(--serif);font-style:italic;
    font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;
    text-align:center;padding:2rem;
  }
  .about-text p{margin-bottom:1.2rem;color:var(--text);line-height:1.8}
  .about-stats{
    display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;
    margin-top:2.5rem;padding-top:2.5rem;
    border-top:1px solid var(--gold-line);
  }
  .about-stats div .num{
    font-family:var(--serif);font-size:2.5rem;color:var(--gold);
    display:block;line-height:1;
  }
  .about-stats div .lbl{
    font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
    color:var(--text-mute);margin-top:.5rem;
  }

  /* ===== RESTORAN / MENI ===== */
  .restaurant{background:var(--bg-2);max-width:none;width:100%}
  .restaurant-inner{max-width:1300px;margin:0 auto}
  .menu-tabs{
    display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;
    margin:3rem 0 4rem;
    padding-bottom:2rem;border-bottom:1px solid var(--gold-line);
  }
  .menu-tab{
    padding:.7rem 1.6rem;background:transparent;
    border:1px solid var(--gold-line);color:var(--text-mute);
    font-family:var(--sans);font-size:.75rem;letter-spacing:.2em;
    text-transform:uppercase;cursor:pointer;
    transition:all .3s;font-weight:300;
  }
  .menu-tab:hover{color:var(--gold);border-color:var(--gold)}
  .menu-tab.active{
    background:var(--gold);color:#0a0a0a;border-color:var(--gold);
    font-weight:500;
  }
  .menu-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:2rem 4rem;
  }
  .menu-item{
    padding-bottom:1.5rem;border-bottom:1px dashed var(--gold-line);
    cursor:pointer;transition:all .3s;
  }
  .menu-item:hover{padding-left:.5rem}
  .menu-item-head{
    display:flex;justify-content:space-between;align-items:baseline;
    gap:1rem;margin-bottom:.4rem;
  }
  .menu-item-name{
    font-family:var(--serif);font-size:1.3rem;color:var(--text);
    font-weight:500;
  }
  .menu-item-price{
    font-family:var(--serif);font-size:1.2rem;color:var(--gold);
    white-space:nowrap;font-style:italic;
  }
  .menu-item-desc{
    font-size:.88rem;color:var(--text-mute);line-height:1.5;
  }
  .menu-cta{text-align:center;margin-top:4rem}

  /* ===== SALON ===== */
  .salon-hero{
    text-align:center;max-width:800px;margin:0 auto 5rem;
  }
  .salon-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;
  }
  .salon-card{
    padding:2.5rem 2rem;
    background:linear-gradient(180deg,rgba(26,22,18,.5) 0%,rgba(10,10,10,.5) 100%);
    border:1px solid var(--gold-line);
    text-align:center;position:relative;overflow:hidden;
    transition:all .5s ease;
  }
  .salon-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
    transform:translateX(-100%);transition:transform .6s;
  }
  .salon-card:hover{
    border-color:var(--gold);
    transform:translateY(-5px);
    background:linear-gradient(180deg,rgba(40,32,20,.5) 0%,rgba(20,16,10,.5) 100%);
  }
  .salon-card:hover::before{transform:translateX(100%)}
  .salon-icon{
    font-family:var(--serif);font-size:2.5rem;color:var(--gold);
    margin-bottom:1rem;font-style:italic;
  }
  .salon-card h3{
    font-family:var(--serif);font-size:1.6rem;font-weight:400;
    margin-bottom:1rem;color:var(--text);
  }
  .salon-card p{font-size:.9rem;color:var(--text-mute);line-height:1.6;margin-bottom:1.5rem}
  .salon-card ul{list-style:none;text-align:left;font-size:.85rem;color:var(--text)}
  .salon-card li{padding:.4rem 0;border-bottom:1px dashed var(--gold-line)}
  .salon-card li::before{content:'◆ ';color:var(--gold);font-size:.6rem;margin-right:.5rem}
  .salon-card li:last-child{border:none}

  .capacity-banner{
    margin-top:4rem;padding:3rem 2rem;
    background:linear-gradient(135deg,rgba(201,169,97,.08),rgba(201,169,97,.02));
    border:1px solid var(--gold-line);
    display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;
    text-align:center;
  }
  .capacity-banner div .num{
    font-family:var(--serif);font-size:2.8rem;color:var(--gold-bright);
    display:block;line-height:1;
  }
  .capacity-banner div .lbl{
    font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
    color:var(--text-mute);margin-top:.5rem;display:block;
  }

  /* ===== GALERIJA ===== */
  .gallery{background:var(--bg);max-width:none;width:100%}
  .gallery-inner{max-width:1400px;margin:0 auto;padding:0 2rem}
  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:200px;
    gap:1rem;margin-top:3rem;
  }
  .gallery-item{
    background:linear-gradient(135deg,#1a1612,#2a2218);
    border:1px solid var(--gold-line);
    position:relative;overflow:hidden;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:all .4s;
  }
  .gallery-item:nth-child(1){grid-column:span 2;grid-row:span 2}
  .gallery-item:nth-child(4){grid-row:span 2}
  .gallery-item:nth-child(7){grid-column:span 2}
  .gallery-item:hover{border-color:var(--gold);transform:scale(.98)}
  .gallery-item::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(0deg,rgba(0,0,0,.7),transparent 50%);
    opacity:0;transition:opacity .3s;
  }
  .gallery-item:hover::after{opacity:1}
  .gallery-label{
    color:var(--gold-deep);font-family:var(--serif);font-style:italic;
    font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;
    z-index:2;text-align:center;padding:1rem;
  }
  .gallery-tag{
    position:absolute;bottom:1rem;left:1rem;z-index:3;
    color:var(--gold-bright);font-size:.75rem;letter-spacing:.2em;
    text-transform:uppercase;opacity:0;transition:opacity .3s;
  }
  .gallery-item:hover .gallery-tag{opacity:1}

  /* ===== KONTAKT ===== */
  .contact{background:var(--bg-2);max-width:none;width:100%}
  .contact-inner{
    max-width:1300px;margin:0 auto;
    display:grid;grid-template-columns:1fr 1fr;gap:5rem;
  }
  .contact-info h3{
    font-family:var(--serif);font-size:1.1rem;color:var(--gold);
    text-transform:uppercase;letter-spacing:.2em;font-weight:500;
    margin:2rem 0 .6rem;
  }
  .contact-info h3:first-of-type{margin-top:3rem}
  .contact-info p{color:var(--text);line-height:1.7}
  .contact-info a{color:var(--gold-bright);text-decoration:none;border-bottom:1px solid var(--gold-line)}
  .contact-info a:hover{border-color:var(--gold)}
  .hours-table{margin-top:.5rem;font-size:.95rem}
  .hours-row{
    display:flex;justify-content:space-between;
    padding:.5rem 0;border-bottom:1px dashed var(--gold-line);
  }
  .hours-row span:first-child{color:var(--text-mute);text-transform:uppercase;font-size:.78rem;letter-spacing:.15em}
  .hours-row span:last-child{color:var(--text);font-family:var(--serif);font-style:italic}

  .map-placeholder{
    aspect-ratio:1/1;
    background:
      linear-gradient(135deg,rgba(201,169,97,.08),transparent),
      repeating-linear-gradient(45deg,#121212 0,#121212 2px,#1a1612 2px,#1a1612 4px);
    border:1px solid var(--gold-line);
    position:relative;
    display:flex;align-items:center;justify-content:center;
  }
  .map-pin{
    text-align:center;color:var(--gold);
  }
  .map-pin svg{width:50px;height:50px;margin-bottom:1rem}
  .map-pin .name{font-family:var(--serif);font-size:1.4rem;font-style:italic}
  .map-pin .place{font-size:.8rem;letter-spacing:.3em;text-transform:uppercase;color:var(--text-mute);margin-top:.3rem}

  /* ===== FOOTER ===== */
  footer{
    background:#000;padding:4rem 2rem 2rem;
    border-top:1px solid var(--gold-line);text-align:center;
  }
  .footer-logo{
    font-family:var(--serif);font-size:2rem;color:var(--gold);
    letter-spacing:.15em;text-transform:uppercase;margin-bottom:.5rem;
  }
  .footer-logo span{font-style:italic;color:var(--gold-bright)}
  .footer-tag{
    color:var(--text-mute);font-family:var(--serif);font-style:italic;
    margin-bottom:2rem;
  }
  .footer-social{display:flex;gap:1.5rem;justify-content:center;margin-bottom:2rem}
  .footer-social a{
    width:42px;height:42px;border:1px solid var(--gold-line);
    display:flex;align-items:center;justify-content:center;
    color:var(--gold);transition:all .3s;
  }
  .footer-social a:hover{background:var(--gold);color:#000;border-color:var(--gold)}
  .footer-social svg{width:18px;height:18px}
  .footer-bottom{
    padding-top:2rem;border-top:1px solid var(--gold-line);
    color:var(--text-mute);font-size:.78rem;letter-spacing:.15em;
    text-transform:uppercase;
  }

  /* ===== ANIMACIJE ===== */
  @keyframes fadeUp{
    from{opacity:0;transform:translateY(30px)}
    to{opacity:1;transform:translateY(0)}
  }
  @keyframes fadeIn{from{opacity:0}to{opacity:1}}
  @keyframes scrollDown{
    0%{transform:scaleY(0);transform-origin:top}
    50%{transform:scaleY(1);transform-origin:top}
    51%{transform:scaleY(1);transform-origin:bottom}
    100%{transform:scaleY(0);transform-origin:bottom}
  }
  .reveal{opacity:0;transform:translateY(40px);transition:all 1s ease}
  .reveal.visible{opacity:1;transform:translateY(0)}


  /* === V2 ADDITIONS === */
  .nav-logo{display:flex;align-items:center;gap:.7rem;text-decoration:none}
  .nav-logo-img{width:38px;height:38px;border-radius:50%;object-fit:cover;border:1px solid var(--gold-line)}
  .nav-logo-text{font-family:var(--serif);font-size:1.1rem;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;font-weight:500}
  .nav-logo-text em{color:var(--gold-bright);font-style:italic;font-weight:400}

  .hero-logo-circle{
    width:120px;height:120px;border-radius:50%;
    overflow:hidden;margin-bottom:1.5rem;
    border:2px solid var(--gold);
    box-shadow:0 0 60px rgba(201,169,97,.4), inset 0 0 20px rgba(0,0,0,.5);
    opacity:0;animation:fadeUp 1s .1s forwards;
  }
  .hero-logo-circle img{width:100%;height:100%;object-fit:cover}
  .hero{background-attachment:fixed}
  .hero::before{
    content:'';position:absolute;inset:0;
    background:radial-gradient(ellipse at center, transparent 30%, rgba(8,6,4,.7) 100%);
    pointer-events:none;
  }
  .hero > *{position:relative;z-index:2}

  .about-img{
    aspect-ratio:4/5;
    border:1px solid var(--gold-line);
    position:relative;
    box-shadow:0 30px 60px rgba(0,0,0,.5);
  }
  .about-img::before{
    content:'';position:absolute;inset:1rem;
    border:1px solid rgba(232,197,115,.4);
    pointer-events:none;
  }
  .about-img::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.4) 100%);
    pointer-events:none;
  }

  .featured-dish{
    display:grid;grid-template-columns:1fr 1fr;gap:3rem;
    align-items:center;margin:3rem 0 4rem;
    padding:2.5rem;
    background:linear-gradient(135deg,rgba(201,169,97,.05),transparent);
    border:1px solid var(--gold-line);
  }
  .featured-dish-img{
    display:block;
    border:1px solid var(--gold-line);
    box-shadow:0 20px 40px rgba(0,0,0,.4);
    overflow:hidden;
    background:#0a0a0a;
    line-height:0;
  }
  .featured-dish-img img{
    width:100%;
    height:auto;
    display:block;
  }
  .featured-dish-text h3{
    font-family:var(--serif);font-size:2.2rem;font-weight:400;
    color:var(--gold-bright);margin:.5rem 0 1rem;font-style:italic;
  }
  .featured-dish-text p{color:var(--text-mute);line-height:1.7;font-size:1.05rem}

  .gallery-item{
    background-size:cover;background-position:center;
  }
  .gallery-item .gallery-tag{
    opacity:1;color:var(--gold-bright);
    background:rgba(8,6,4,.7);padding:.4rem .8rem;
    backdrop-filter:blur(8px);
    border:1px solid var(--gold-line);
  }
  .gallery-item::before{
    content:'';position:absolute;inset:0;
    background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 60%);
    z-index:1;transition:opacity .3s;
  }
  .gallery-item:hover::before{background:linear-gradient(0deg,rgba(0,0,0,.3),transparent 60%)}

  @media(max-width:900px){
    .hero{background-attachment:scroll}
    .hero-logo-circle{width:90px;height:90px}
    .nav-logo-img{width:32px;height:32px}
    .nav-logo-text{font-size:.95rem}
    .featured-dish{grid-template-columns:1fr;gap:1.5rem;padding:1.2rem}
    
    .featured-dish-text h3{font-size:1.6rem}
  }

  /* ===== TABLET (≤1100px) ===== */
  @media(max-width:1100px){
    .gallery-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:180px}
    .gallery-item:nth-child(7){grid-column:span 1}
    .salon-grid{grid-template-columns:repeat(2,1fr)}
    .salon-grid > :last-child{grid-column:1/-1;max-width:600px;justify-self:center}
  }

  /* ===== MOBILE (≤900px) ===== */
  @media(max-width:900px){
    nav{padding:1rem 1.2rem}
    nav.scrolled{padding:.8rem 1.2rem}
    .nav-links{
      position:fixed;top:0;right:-100%;
      width:80%;max-width:340px;height:100vh;
      background:#0a0a0a;
      flex-direction:column;justify-content:center;align-items:center;
      gap:2.2rem;transition:right .4s ease;
      border-left:1px solid var(--gold-line);
      padding:2rem;
    }
    .nav-links.open{right:0}
    .nav-links a{font-size:1.05rem}
    .burger{display:block;z-index:103}

    section{padding:4.5rem 1.2rem}
    .hero{padding:6rem 1.2rem 5rem;min-height:auto}

    .about{grid-template-columns:1fr;gap:2.5rem}
    .about-img{aspect-ratio:1/1;max-width:500px;margin:0 auto;width:100%}
    .about-stats{gap:1rem}
    .about-stats div .num{font-size:1.8rem}

    .featured-dish{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem;margin:2rem 0 3rem}
    .featured-dish-text h3{font-size:1.6rem}
    

    .menu-grid{grid-template-columns:1fr;gap:1.5rem}
    .menu-tabs{margin:2rem 0 2.5rem;gap:.4rem}
    .menu-tab{padding:.6rem 1.1rem;font-size:.7rem}

    .salon-grid{grid-template-columns:1fr;gap:1.5rem}
    .salon-grid > :last-child{grid-column:auto;max-width:none}
    .capacity-banner{grid-template-columns:repeat(2,1fr);gap:1.5rem;padding:2rem 1.2rem;margin-top:3rem}
    .capacity-banner div .num{font-size:2rem}

    .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px;gap:.7rem}
    .gallery-item:nth-child(1){grid-column:span 2;grid-row:span 1}
    .gallery-item:nth-child(4){grid-row:span 1}
    .gallery-item:nth-child(7){grid-column:span 2}

    .contact-inner{grid-template-columns:1fr;gap:2.5rem}
    .map-placeholder{aspect-ratio:4/3;max-height:400px}

    .hero-meta{gap:1.5rem;margin-bottom:2.5rem}
    .hero-meta .num{font-size:1.7rem}
    .hero-cta{width:100%;flex-direction:column;align-items:stretch;max-width:320px}
    .hero-cta .btn{width:100%;min-width:auto}

    h2{font-size:clamp(1.8rem,7vw,2.6rem)}
    .lead{font-size:1.1rem}
  }

  /* ===== SMALL MOBILE (≤480px) ===== */
  @media(max-width:480px){
    section{padding:4rem 1rem}
    .hero{padding:5.5rem 1rem 4rem}
    .hero-ornament{font-size:.75rem;letter-spacing:.2em;margin-bottom:1.5rem}
    .hero-ornament::before,.hero-ornament::after{width:30px}
    .hero-sub{margin-bottom:2rem}

    .nav-logo-text{font-size:.85rem;letter-spacing:.12em}
    .nav-logo-img{width:30px;height:30px}

    .hero-meta{gap:1.2rem;margin-bottom:2rem}
    .hero-meta > div{min-width:80px}
    .hero-meta .num{font-size:1.5rem}
    .hero-meta .lbl{font-size:.6rem;letter-spacing:.18em}

    .btn{padding:.9rem 1.5rem;font-size:.72rem;letter-spacing:.2em}

    .about-stats{grid-template-columns:1fr;gap:1.2rem;text-align:center}
    .about-stats div .num{font-size:2rem}

    .menu-tabs{padding-bottom:1.5rem;margin:2rem 0 2rem}
    .menu-tab{padding:.55rem .9rem;font-size:.65rem;letter-spacing:.15em}
    .menu-item-name{font-size:1.15rem}
    .menu-item-price{font-size:1.05rem}

    .salon-card{padding:2rem 1.5rem}
    .capacity-banner{grid-template-columns:1fr 1fr;gap:1.2rem;padding:1.5rem 1rem}
    .capacity-banner div .num{font-size:1.7rem}
    .capacity-banner div .lbl{font-size:.62rem;letter-spacing:.15em}

    .gallery-grid{grid-template-columns:1fr;grid-auto-rows:200px}
    .gallery-item:nth-child(1),.gallery-item:nth-child(7){grid-column:span 1}

    .contact-info h3{font-size:1rem}
    .hours-row{font-size:.85rem}

    .footer-logo{font-size:1.5rem}
    .footer-social a{width:38px;height:38px}
  }

  /* ===== LANDSCAPE PHONE ===== */
  @media(max-width:900px) and (orientation:landscape) and (max-height:500px){
    .hero{min-height:auto;padding:5rem 1.5rem 3rem}
    .hero-logo-circle{width:70px;height:70px;margin-bottom:1rem}
    .hero h1{font-size:2.5rem}
    .hero-meta{margin-bottom:1.5rem}
    .scroll-indicator{display:none}
  }