/* ===== TABLE O'CLOCK HOME V2 ===== */

.marketplace-home{
  overflow-x:hidden;
}

/* HERO */

.home-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(460px,.9fr);
  column-gap:70px;
  align-items:center;
  padding:90px 6vw 60px;
  background:
    radial-gradient(circle at 82% 18%,rgba(181,139,63,.18),transparent 27%),
    linear-gradient(180deg,#fbf8f1,#f2eadc);
}

.home-hero-copy{
  max-width:720px;
}

.home-hero h1{
  margin:16px 0 28px;
  font-size:clamp(4rem,7vw,7.4rem);
  line-height:.9;
}

.home-hero-lead{
  max-width:620px;
  color:#625d55;
  font-size:1.12rem;
  line-height:1.7;
}

.hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:30px;
}

.hero-primary,
.hero-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 19px;
  border-radius:999px;
  text-decoration:none;
  font-size:.88rem;
  font-weight:700;
}

.hero-primary{
  background:#111;
  color:#fff;
}

.hero-secondary{
  border:1px solid rgba(17,17,17,.18);
  background:rgba(255,255,255,.45);
}

.hero-proof{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin-top:28px;
  color:#70695f;
  font-size:.78rem;
}

.hero-proof span{
  position:relative;
  padding-left:12px;
}

.hero-proof span:before{
  content:"";
  position:absolute;
  left:0;
  top:.45em;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#b58b3f;
}

/* HERO VISUAL */

.home-hero-visual{
  position:relative;
  width:100%;
  max-width:720px;
}

.hero-window{
  overflow:hidden;
  border:1px solid rgba(17,17,17,.13);
  border-radius:24px;
  background:#fff;
  box-shadow:0 35px 80px rgba(40,32,20,.16);
}

.hero-window-bar{
  display:flex;
  align-items:center;
  height:42px;
  padding:0 14px;
  background:#fbfaf7;
  border-bottom:1px solid rgba(17,17,17,.08);
}

.window-dots{
  display:flex;
  gap:5px;
}

.window-dots span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#cec8bd;
}

.window-url{
  margin:auto;
  padding-right:34px;
  color:#80796f;
  font-size:.65rem;
}

.hero-window img{
  display:block;
  width:100%;
  height:auto;
}

.floating-card{
  position:absolute;
  z-index:3;
  min-width:155px;
  padding:14px 16px;
  border:1px solid rgba(17,17,17,.1);
  border-radius:16px;
  background:rgba(255,255,255,.95);
  box-shadow:0 18px 45px rgba(25,20,14,.15);
}

.floating-card strong,
.floating-card small{
  display:block;
}

.floating-card small{
  margin-top:3px;
  color:#7a746b;
  font-size:.68rem;
}

.floating-label{
  color:#a67c32;
  font-size:.58rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.floating-one{
  right:-20px;
  bottom:18%;
}

.floating-two{
  left:-25px;
  bottom:-20px;
  display:flex;
  align-items:center;
  gap:10px;
}

.floating-check{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:#111;
  color:#d1aa58;
}

.home-search{
  grid-column:1/-1;
  width:100%;
  margin-top:60px;
}

.hero-live{
  grid-column:1/-1;
  margin-top:14px;
}

.section-intro{
  max-width:390px;
  color:#746d62;
  line-height:1.6;
}

/* DISCOVER BOOK MANAGE */

.experience-section{
  display:grid;
  grid-template-columns:.75fr 1.55fr;
  gap:70px;
  padding:105px 6vw;
  background:#e9e1d2;
}

.experience-heading h2{
  margin:10px 0 0;
  font-family:"Playfair Display",serif;
  font-size:clamp(3rem,5.4vw,5.6rem);
  line-height:.92;
}

.experience-heading em{
  color:#a57c32;
  font-weight:500;
}

.experience-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.experience-card{
  min-height:315px;
  padding:28px;
  border:1px solid rgba(17,17,17,.11);
  border-radius:22px;
  background:rgba(255,255,255,.4);
}

.featured-experience{
  background:#111;
  color:#fff;
  transform:translateY(-18px);
}

.experience-number{
  color:#918a7d;
  font-size:.67rem;
}

.experience-icon{
  margin-top:70px;
  color:#a77c31;
  font-size:2rem;
}

.experience-card h3{
  margin:15px 0 8px;
  font-family:"Playfair Display",serif;
  font-size:1.8rem;
}

.experience-card p{
  color:#6c665d;
  font-size:.88rem;
  line-height:1.55;
}

.featured-experience p{
  color:#aaa;
}

/* TONIGHT */

.tonight-premium{
  background:
    radial-gradient(circle at 85% 15%,rgba(181,139,63,.18),transparent 28%),
    #111;
}

.tonight-copy{
  max-width:560px;
  margin:-12px 0 32px;
  color:#aaa;
  line-height:1.6;
}

/* GUEST APP */

.guest-app-section{
  display:grid;
  grid-template-columns:1fr .8fr;
  align-items:center;
  min-height:650px;
  padding:90px 9vw;
  background:
    radial-gradient(circle at 76% 40%,rgba(181,139,63,.22),transparent 28%),
    #151412;
  color:#fff;
}

.guest-app-copy{
  max-width:610px;
}

.guest-app-copy h2{
  margin:10px 0 22px;
  font-size:clamp(3.2rem,6vw,6rem);
  line-height:.94;
}

.guest-app-copy>p:not(.eyebrow){
  max-width:540px;
  color:#b5b0a8;
  font-size:1.02rem;
  line-height:1.7;
}

.coming-pill{
  display:inline-flex;
  margin-top:20px;
  padding:10px 15px;
  border:1px solid rgba(201,164,84,.5);
  border-radius:999px;
  color:#d1aa5d;
  font-size:.77rem;
  font-weight:700;
}

/* PHONE MOCKUP */

.phone-stage{
  display:grid;
  place-items:center;
  min-height:520px;
}

.phone-shell{
  position:relative;
  width:270px;
  height:560px;
  padding:9px;
  border:2px solid #4a4740;
  border-radius:48px;
  background:#050505;
  box-shadow:0 50px 90px rgba(0,0,0,.5);
  transform:rotate(4deg);
}

.phone-island{
  position:absolute;
  z-index:4;
  top:21px;
  left:50%;
  width:92px;
  height:25px;
  border-radius:999px;
  background:#000;
  transform:translateX(-50%);
}

.phone-screen{
  position:relative;
  height:100%;
  overflow:hidden;
  padding:55px 18px 18px;
  border-radius:39px;
  background:#f5f0e6;
  color:#111;
}

.phone-brand{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
}

.phone-eyebrow{
  margin-top:75px;
  color:#9b742d;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.12em;
}

.phone-reservation{
  display:flex;
  flex-direction:column;
  margin-top:10px;
  padding:20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 30px rgba(40,31,20,.08);
}

.phone-reservation span{
  color:#9b742d;
  font-size:.66rem;
}

.phone-reservation strong{
  margin:14px 0 6px;
  font-family:"Playfair Display",serif;
  font-size:1.45rem;
}

.phone-reservation small{
  color:#746e64;
}

.phone-actions{
  position:absolute;
  right:15px;
  bottom:18px;
  left:15px;
  display:flex;
  justify-content:space-between;
  padding:12px;
  border-radius:15px;
  background:#fff;
  font-size:.55rem;
}

/* RESTAURANT PLATFORM */

.restaurant-platform-section{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:80px;
  padding:110px 6vw;
  background:#f7f3eb;
}

.restaurant-platform-copy h2{
  margin:10px 0 24px;
  font-size:clamp(3rem,5.4vw,5.4rem);
  line-height:.94;
}

.restaurant-platform-copy>p:not(.eyebrow){
  max-width:570px;
  color:#686158;
  line-height:1.7;
}

.platform-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}

.platform-primary,
.platform-secondary{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0 16px;
  border-radius:999px;
  text-decoration:none;
  font-size:.8rem;
  font-weight:700;
}

.platform-primary{
  background:#111;
  color:#fff;
}

.platform-secondary{
  border:1px solid rgba(17,17,17,.18);
}

.platform-feature-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.platform-feature-grid article{
  display:flex;
  gap:15px;
  min-height:145px;
  padding:21px;
  border:1px solid rgba(17,17,17,.09);
  border-radius:18px;
  background:rgba(255,255,255,.65);
}

.feature-symbol{
  color:#a37b34;
  font-size:1.2rem;
}

.platform-feature-grid strong{
  font-size:.91rem;
}

.platform-feature-grid p{
  margin:7px 0 0;
  color:#797268;
  font-size:.78rem;
  line-height:1.5;
}

/* BUILT IN A REAL RESTAURANT */

.built-section{
  padding:100px 13vw;
  background:#e9e1d2;
  text-align:center;
}

.built-rule{
  width:45px;
  height:1px;
  margin:0 auto 30px;
  background:#b58b3f;
}

.built-section blockquote{
  max-width:970px;
  margin:20px auto;
  font-family:"Playfair Display",serif;
  font-size:clamp(2.2rem,4.5vw,4.3rem);
  line-height:1.05;
}

.built-copy{
  max-width:680px;
  margin:28px auto 0;
  color:#6f675d;
  line-height:1.7;
}

.home-final-cta{
  margin-top:80px;
}

/* TABLET */

@media(max-width:1100px){

  .home-hero{
    grid-template-columns:1fr;
    gap:55px;
  }

  .home-hero-visual{
    max-width:820px;
  }

  .experience-section{
    grid-template-columns:1fr;
  }

  .restaurant-platform-section{
    grid-template-columns:1fr;
  }
}

/* MOBILE */

@media(max-width:800px){

  .home-hero{
    padding:70px 22px 48px;
  }

  .home-hero h1{
    font-size:clamp(3.7rem,15vw,5.6rem);
  }

  .experience-section{
    grid-template-columns:1fr;
    padding:75px 22px;
  }

  .experience-grid{
    grid-template-columns:1fr;
  }

  .featured-experience{
    transform:none;
  }

  .experience-card{
    min-height:220px;
  }

  .experience-icon{
    margin-top:35px;
  }

  .guest-app-section{
    grid-template-columns:1fr;
    gap:45px;
    padding:75px 22px;
  }

  .restaurant-platform-section{
    grid-template-columns:1fr;
    padding:75px 22px;
  }

  .platform-feature-grid{
    grid-template-columns:1fr;
  }

  .built-section{
    padding:75px 22px;
  }
}

@media(max-width:600px){

  .home-hero{
    padding-left:18px;
    padding-right:18px;
  }

  .floating-card{
    display:none;
  }

  .phone-shell{
    width:245px;
    height:510px;
  }

  .guest-app-copy h2,
  .restaurant-platform-copy h2{
    font-size:3rem;
  }
}

/* ===== Dynamic marketplace spotlight ===== */

.marketplace-home .grid.grid-count-1{
  grid-template-columns:minmax(0,900px);
}

.marketplace-home .grid.grid-count-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:1180px;
}

.marketplace-home .grid.grid-count-1 .card{
  display:grid;
  grid-template-columns:minmax(340px,1.08fr) minmax(300px,.92fr);
  min-height:360px;
}

.marketplace-home .grid.grid-count-1 .card > a{
  display:block !important;
  height:100%;
}

.marketplace-home .grid.grid-count-1 .pic{
  height:100%;
  min-height:360px;
}

.marketplace-home .grid.grid-count-1 .body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:42px;
}

.marketplace-home .grid.grid-count-1 .body h3{
  font-size:clamp(2rem,3vw,2.8rem);
  line-height:1.02;
}

.marketplace-home .grid.grid-count-1 .desc{
  max-width:460px;
  font-size:.96rem;
  line-height:1.7;
}

.marketplace-home .grid.grid-count-1 .actions{
  margin-top:28px;
}

@media(max-width:800px){

  .marketplace-home .grid.grid-count-1,
  .marketplace-home .grid.grid-count-2{
    grid-template-columns:1fr;
    max-width:none;
  }

  .marketplace-home .grid.grid-count-1 .card{
    display:block;
    min-height:0;
  }

  .marketplace-home .grid.grid-count-1 .pic{
    height:260px;
    min-height:260px;
  }

  .marketplace-home .grid.grid-count-1 .body{
    padding:26px;
  }
}



/* =========================================================
   TABLE O'CLOCK — LAUNCH MODE
   Optimized while marketplace has few restaurants
   ========================================================= */


/* Keep major sections visually tighter */

#featured,
#restaurants{
  padding-top:72px;
  padding-bottom:72px;
}


/* ---------- SINGLE RESTAURANT SPOTLIGHT ---------- */

#featuredGrid:has(> .card:only-child),
#allGrid:has(> .card:only-child),
#tonightGrid:has(> .card:only-child){
  display:block;
  width:100%;
  max-width:1180px;
}


#featuredGrid > .card:only-child,
#allGrid > .card:only-child,
#tonightGrid > .card:only-child{
  display:grid;
  grid-template-columns:minmax(420px,1.1fr) minmax(340px,.9fr);
  width:100%;
  min-height:390px;
  overflow:hidden;
}


/* image side */

#featuredGrid > .card:only-child > a,
#allGrid > .card:only-child > a,
#tonightGrid > .card:only-child > a{
  display:block !important;
  height:100%;
}


#featuredGrid > .card:only-child .pic,
#allGrid > .card:only-child .pic,
#tonightGrid > .card:only-child .pic{
  height:100%;
  min-height:390px;
}


/* content side */

#featuredGrid > .card:only-child .body,
#allGrid > .card:only-child .body,
#tonightGrid > .card:only-child .body{
  display:flex !important;
  flex-direction:column;
  justify-content:center;
  padding:46px;
}


#featuredGrid > .card:only-child h3,
#allGrid > .card:only-child h3,
#tonightGrid > .card:only-child h3{
  margin:11px 0 10px;
  font-size:clamp(2.2rem,3.2vw,3.15rem);
  line-height:1;
}


#featuredGrid > .card:only-child .desc,
#allGrid > .card:only-child .desc,
#tonightGrid > .card:only-child .desc{
  max-width:470px;
  font-size:1rem;
  line-height:1.7;
}


#featuredGrid > .card:only-child .actions,
#allGrid > .card:only-child .actions,
#tonightGrid > .card:only-child .actions{
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid rgba(17,17,17,.08);
}


/* dark Tonight version */

#tonightGrid > .card:only-child{
  background:#181818;
  border-color:rgba(255,255,255,.12);
}

#tonightGrid > .card:only-child .actions{
  border-top-color:rgba(255,255,255,.1);
}


/* ---------- HEADING BALANCE ---------- */

#featured .heading,
#restaurants .heading{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,420px);
  align-items:end;
  max-width:1180px;
}

#featured .heading h2,
#restaurants .heading h2{
  max-width:720px;
}

#featured .section-intro,
#restaurants .section-intro{
  justify-self:end;
}


/* ---------- DISCOVER / BOOK / MANAGE ---------- */

.experience-section{
  min-height:auto;
}

.experience-card{
  min-height:280px;
}

.experience-icon{
  margin-top:50px;
}


/* ---------- TONIGHT ---------- */

#tonight{
  padding-top:80px;
  padding-bottom:80px;
}


/* ---------- CUISINES ---------- */

.cuisine-section{
  padding-top:70px;
  padding-bottom:70px;
}


/* ---------- REMOVE EMPTY FEEL ---------- */

.home-section .grid + .empty.hidden,
.section .grid + .empty.hidden{
  margin:0;
}


/* ---------- MOBILE ---------- */

@media(max-width:800px){

  #featured,
  #restaurants{
    padding-top:58px;
    padding-bottom:58px;
  }

  #featured .heading,
  #restaurants .heading{
    display:block;
  }

  #featured .section-intro,
  #restaurants .section-intro{
    margin-top:16px;
  }

  #featuredGrid > .card:only-child,
  #allGrid > .card:only-child,
  #tonightGrid > .card:only-child{
    display:block;
    min-height:0;
  }

  #featuredGrid > .card:only-child .pic,
  #allGrid > .card:only-child .pic,
  #tonightGrid > .card:only-child .pic{
    height:260px;
    min-height:260px;
  }

  #featuredGrid > .card:only-child .body,
  #allGrid > .card:only-child .body,
  #tonightGrid > .card:only-child .body{
    padding:26px;
  }

}


/* ===== SINGLE RESTAURANT CARD FINAL FIX ===== */

#featuredGrid > article.card:only-child,
#allGrid > article.card:only-child,
#tonightGrid > article.card:only-child{
  display:grid !important;
  grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr) !important;
  width:100% !important;
  max-width:1180px !important;
  height:auto !important;
  min-height:360px !important;
  overflow:hidden !important;
  align-items:stretch !important;
}

#featuredGrid > article.card:only-child > a,
#allGrid > article.card:only-child > a,
#tonightGrid > article.card:only-child > a{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
}

#featuredGrid > article.card:only-child .pic,
#allGrid > article.card:only-child .pic,
#tonightGrid > article.card:only-child .pic{
  width:100% !important;
  height:100% !important;
  min-height:360px !important;
  border-radius:0 !important;
}

#featuredGrid > article.card:only-child .body,
#allGrid > article.card:only-child .body,
#tonightGrid > article.card:only-child .body{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  height:auto !important;
  padding:42px !important;
  visibility:visible !important;
  opacity:1 !important;
  overflow:visible !important;
  position:relative !important;
}

#featuredGrid > article.card:only-child .meta,
#featuredGrid > article.card:only-child h3,
#featuredGrid > article.card:only-child .desc,
#featuredGrid > article.card:only-child .actions,
#allGrid > article.card:only-child .meta,
#allGrid > article.card:only-child h3,
#allGrid > article.card:only-child .desc,
#allGrid > article.card:only-child .actions,
#tonightGrid > article.card:only-child .meta,
#tonightGrid > article.card:only-child h3,
#tonightGrid > article.card:only-child .desc,
#tonightGrid > article.card:only-child .actions{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

#featuredGrid > article.card:only-child h3,
#allGrid > article.card:only-child h3,
#tonightGrid > article.card:only-child h3{
  font-size:clamp(2rem,3vw,2.7rem) !important;
  line-height:1.05 !important;
}

#featuredGrid > article.card:only-child .actions,
#allGrid > article.card:only-child .actions,
#tonightGrid > article.card:only-child .actions{
  margin-top:24px !important;
}

@media(max-width:800px){

  #featuredGrid > article.card:only-child,
  #allGrid > article.card:only-child,
  #tonightGrid > article.card:only-child{
    display:block !important;
    min-height:0 !important;
  }

  #featuredGrid > article.card:only-child .pic,
  #allGrid > article.card:only-child .pic,
  #tonightGrid > article.card:only-child .pic{
    height:260px !important;
    min-height:260px !important;
  }

  #featuredGrid > article.card:only-child .body,
  #allGrid > article.card:only-child .body,
  #tonightGrid > article.card:only-child .body{
    padding:26px !important;
  }
}