/*
Theme Name: 305 Tables
Theme URI: https://305tables.com
Author: 305 Tables
Description: A Miami deco-modern dining guide theme for 305 Tables. Neighborhood-first restaurant content with an art-deco hero, ocean/coral/gold palette, Fraunces + DM Sans typography.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: t305tables
*/

:root{
  --ocean:#0E3A4F; --ocean-deep:#08293A; --coral:#FF6B5C; --coral-deep:#E8503F;
  --gold:#F5B544; --aqua:#6FD0C5; --sand:#FBF4E9; --sand-2:#F3E7D3;
  --ink:#14272F; --muted:#5C7079; --line:rgba(20,39,47,.14);
  --display:'Fraunces',Georgia,serif; --sans:'DM Sans',system-ui,sans-serif;
  --shadow:0 18px 40px -22px rgba(8,41,58,.45);
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--sand);line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:var(--coral-deep);text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;height:auto;}
.wrap{width:min(1180px,92vw);margin-inline:auto;}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;}

/* ---------- nav ---------- */
header.site-nav{position:sticky;top:0;z-index:50;background:var(--ocean-deep);color:var(--sand);}
.nav-inner{display:flex;align-items:center;gap:28px;min-height:68px;flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:600;font-size:21px;color:var(--sand);white-space:nowrap;}
.brand:hover{text-decoration:none;}
.nav-links{display:flex;align-items:center;gap:22px;margin-left:auto;font-size:14px;font-weight:500;list-style:none;padding:0;margin-top:0;margin-bottom:0;}
.nav-links a{color:var(--sand);opacity:.85;padding:8px 2px;}
.nav-links a:hover{opacity:1;text-decoration:none;}
.nav-links .cta>a,a.cta{background:var(--coral);color:#fff;padding:9px 16px;border-radius:999px;font-weight:600;opacity:1;}
.nav-links .cta>a:hover{background:var(--coral-deep);}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--ocean);color:var(--sand);overflow:hidden;}
.hero .sun{position:absolute;right:-60px;top:-40px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle at center,var(--gold) 0 22%,var(--coral) 22% 38%,var(--coral-deep) 38% 52%,transparent 52% 100%);opacity:.9;}
.hero .bands{position:absolute;right:-60px;top:200px;width:520px;height:230px;opacity:.85;
  background:repeating-linear-gradient(to bottom,var(--coral) 0 14px,var(--ocean) 14px 26px);
  -webkit-mask:linear-gradient(to bottom,#000,transparent);mask:linear-gradient(to bottom,#000,transparent);}
.hero-inner{position:relative;z-index:2;padding:74px 0 64px;max-width:680px;}
.hero .eyebrow{color:var(--aqua);margin-bottom:18px;}
.hero h1{font-family:var(--display);font-weight:600;font-size:clamp(40px,6.4vw,76px);line-height:.98;margin:0;letter-spacing:-.01em;}
.hero h1 em{font-style:italic;color:var(--gold);}
.hero p.sub{margin-top:22px;font-size:clamp(16px,2.1vw,19px);max-width:520px;color:rgba(251,244,233,.82);}

/* ---------- neighborhood cards ---------- */
.section{padding:54px 0;}
.sec-head .eyebrow{color:var(--coral-deep);margin-bottom:8px;}
.sec-head h2{font-family:var(--display);font-weight:600;font-size:clamp(26px,3.6vw,38px);line-height:1.05;margin:0 0 26px;letter-spacing:-.01em;}
.hood-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.hood-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .22s,box-shadow .22s;}
.hood-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);text-decoration:none;}
.hood-card .top{height:96px;display:flex;align-items:flex-end;padding:14px;}
.hc-brickell{background:linear-gradient(135deg,#1d4a5e,#0E3A4F);}
.hc-havana{background:linear-gradient(135deg,#e8503f,#a52f23);}
.hc-grove{background:linear-gradient(135deg,#5a7a35,#2f4019);}
.hc-doral{background:linear-gradient(135deg,#f5b544,#d07b1e);}
.hood-card .body{padding:16px 18px 20px;}
.hood-card h3{font-family:var(--display);font-weight:600;font-size:21px;margin:0 0 4px;color:var(--ink);}
.hood-card .es{font-style:italic;color:var(--coral-deep);font-size:14px;}

/* ---------- post grid (blog/home below hero) ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .22s,box-shadow .22s;}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.card .thumb{aspect-ratio:16/10;background:linear-gradient(135deg,#1d4a5e,#0E3A4F);overflow:hidden;}
.card .thumb img{width:100%;height:100%;object-fit:cover;}
.card .body{padding:18px;display:flex;flex-direction:column;gap:8px;}
.card h2,.card h3{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.15;margin:0;}
.card h2 a,.card h3 a{color:var(--ink);}
.card .meta{font-size:12.5px;color:var(--muted);font-weight:600;}
.card .excerpt{font-size:14px;color:#33474f;}

/* ---------- single / page content ---------- */
.content{max-width:760px;margin:0 auto;padding:48px 0 64px;}
.content h1.entry-title{font-family:var(--display);font-weight:600;font-size:clamp(30px,5vw,48px);line-height:1.05;letter-spacing:-.01em;margin:0 0 8px;}
.content .entry-meta{color:var(--muted);font-size:13px;font-weight:600;margin-bottom:28px;}
.content h2{font-family:var(--display);font-weight:600;font-size:28px;margin:36px 0 12px;color:var(--ocean);}
.content h3{font-family:var(--display);font-weight:600;font-size:22px;margin:28px 0 10px;}
.content p{font-size:17px;margin:0 0 18px;}
.content ul,.content ol{font-size:17px;margin:0 0 18px;padding-left:22px;}
.content li{margin-bottom:8px;}
.content blockquote{border-left:3px solid var(--coral);margin:24px 0;padding:6px 20px;color:#33474f;font-style:italic;}
.content img{border-radius:12px;}

/* ---------- footer ---------- */
footer.site-footer{background:var(--ocean-deep);color:rgba(251,244,233,.78);padding:48px 0 28px;margin-top:40px;}
footer.site-footer .brand{color:var(--sand);margin-bottom:12px;}
footer.site-footer p{font-size:13.5px;max-width:300px;line-height:1.6;}
footer .foot-bot{margin-top:30px;padding-top:18px;border-top:1px solid rgba(251,244,233,.15);font-size:12.5px;color:rgba(251,244,233,.55);}

/* ---------- bits ---------- */
.btn{display:inline-block;background:var(--coral);color:#fff;padding:11px 22px;border-radius:999px;font-weight:600;}
.btn:hover{background:var(--coral-deep);text-decoration:none;}
.pagination{display:flex;gap:10px;justify-content:center;padding:20px 0;}
.pagination a,.pagination span{padding:8px 14px;border:1px solid var(--line);border-radius:9px;background:#fff;}

@media(max-width:980px){.hood-grid{grid-template-columns:repeat(2,1fr);}.post-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.hood-grid,.post-grid{grid-template-columns:1fr;}.hero .sun{width:300px;height:300px;opacity:.55;}.nav-links{gap:14px;}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto;}}
:focus-visible{outline:2px solid var(--aqua);outline-offset:2px;border-radius:4px;}
