/* Sóller Holiday - shared styles (Bootstrap 5 loaded separately) */

:root{
  --stone:#e9e2d6; --sand:#f5f0e8; --ink:#2b2722;
  --olive:#5f6b4d; --terracotta:#b5613f; --muted:#6f675c; --line:#d8cdba;
}
body{font-family:'Fraunces',serif;color:var(--ink);background:var(--sand);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:400;line-height:1.1;letter-spacing:-.01em}
.ff{font-family:'Fraunces',serif}
.muted{color:var(--muted)}

/* NAV */
.navbar{background:var(--sand);border-bottom:1px solid var(--line)}
.navbar .logo{height:42px;width:auto}
.navbar .nav-link{color:var(--ink);letter-spacing:.04em;font-size:.95rem}
.navbar .nav-link:hover{color:var(--terracotta)}

/* SHARED EYEBROW */
.eyebrow{font-size:.74rem;letter-spacing:.34em;text-transform:uppercase;margin-bottom:20px}

/* HERO (home) */
.hero{
  min-height:88vh; display:flex; align-items:flex-end; color:#f7f2e9; position:relative; overflow:hidden;
  background:linear-gradient(180deg,rgba(20,18,15,.15),rgba(20,18,15,.65)),
    url('../img/hero-puig-mayor-soller.jpg') center/cover no-repeat,
    radial-gradient(120% 120% at 70% 10%,#8aa07e 0%,#5f6b4d 38%,#3d4636 70%,#2b3127 100%);
}
.hero::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:46px 46px;mask:linear-gradient(180deg,transparent,#000 60%);opacity:.5}
.hero-inner{position:relative;z-index:2;padding-bottom:64px;animation:rise 1s ease both}
.hero .eyebrow{opacity:.85}
.hero h1{font-size:clamp(2.8rem,7vw,5.6rem);max-width:14ch}
.hero h1 em{font-style:italic;color:#e7c9a3}
.hero .lead{max-width:46ch;margin-top:20px;font-size:1.08rem;opacity:.92;font-weight:300}
.rating{display:inline-flex;align-items:center;gap:10px;margin-top:28px;font-size:.92rem;
  border:1px solid rgba(247,242,233,.35);border-radius:40px;padding:8px 18px}
.rating b{font-family:'Fraunces',serif}
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* SECTIONS (home) */
.sec-title{font-size:clamp(1.9rem,4vw,3rem)}
.facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts .col{padding:30px 18px;border-right:1px solid var(--line)}
.facts .col:last-child{border-right:none}
.facts .n{font-family:'Fraunces',serif;font-size:2rem;display:block}
.facts .l{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:4px}

.feature-card{background:var(--sand);border:1px solid var(--line);height:100%;padding:30px 26px}
.feature-card .tag{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--terracotta);display:block;margin-bottom:14px}
.feature-card h3{font-size:1.18rem;margin-bottom:10px}

.place{background:var(--stone)}
.place li{padding:12px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;list-style:none}
.place ul{padding-left:0;margin-bottom:0}

.btn-terr{background:var(--terracotta);color:#fff;border-radius:40px;padding:15px 40px;letter-spacing:.06em;border:none;transition:.25s}
.btn-terr:hover{background:#9d4f31;color:#fff;transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink);border-radius:40px;padding:15px 40px;letter-spacing:.06em;transition:.25s}
.btn-ghost:hover{background:var(--ink);color:var(--sand)}

/* ARTICLE (blog) */
.article-head{padding:70px 0 30px;border-bottom:1px solid var(--line);margin-bottom:50px}
.article-head .eyebrow{color:var(--terracotta);margin-bottom:18px}
.article-head h1{font-size:clamp(2.2rem,5vw,3.6rem);max-width:18ch;line-height:1.15}
.article-head .meta{color:var(--muted);font-size:.95rem;margin-top:18px}
article{max-width:680px;margin:0 auto;font-size:1.18rem;line-height:1.8}
article p{margin-bottom:1.5rem}
article h2{font-size:clamp(1.5rem,3vw,2rem);margin:48px 0 18px;line-height:1.15}
article a{color:var(--terracotta);text-decoration:underline;text-underline-offset:3px}
article a:hover{color:#9d4f31}
.lead{font-size:1.35rem;color:var(--ink)}
.backlink{display:inline-block;margin-top:30px;color:var(--ink);text-decoration:none;letter-spacing:.04em;border-bottom:1px solid var(--ink)}

/* FOOTER */
footer{background:var(--ink);color:#cfc6b8}
.article-head ~ footer{margin-top:80px}
footer .logo{height:48px}
footer .footer-logo path{fill:#f5f0e8}
footer a{color:#e7c9a3;text-decoration:none}
.reg{font-size:.72rem;line-height:1.9;color:#8d8576;word-break:break-word}
.copyright{border-top:1px solid #423c33;font-size:.78rem;color:#8d8576}