:root{
    --red:#ed1c24;
    --red-dark:#cc0000;
    --cream:#f5f1e9;
    --taupe:#ccb19e;
    --black:#111111;
    --white:#ffffff;
    --serif:'Playfair Display', Georgia, serif;
    --sans:'Work Sans', -apple-system, sans-serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{font-family:var(--sans); color:var(--black); background:var(--white); line-height:1.6;}
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  .container{max-width:1180px; margin:0 auto; padding:0 24px;}
  .label{font-family:var(--sans); font-size:0.75rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--red);}
  .caption{font-family:var(--sans); font-size:0.75rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:#8a7d6f;}
  h1,h2,h3{font-family:var(--serif); font-weight:500; line-height:1.15;}
  h2{font-size:clamp(1.8rem,3.5vw,2.6rem); margin:10px 0 16px;}
  .section{padding:88px 0;}
  .section-cream{background:var(--cream);}
  .section-black{background:var(--black); color:var(--white);}
  .section-intro{max-width:640px; margin-bottom:48px;}
  .section-intro p{color:#555; font-size:1.05rem;}
  .section-black .section-intro p{color:#ccc;}
  .btn{display:inline-block; padding:14px 28px; border-radius:2px; font-weight:600; font-size:0.95rem; letter-spacing:0.02em; transition:opacity .2s;}
  .btn:hover{opacity:0.85;}
  .btn-red{background:var(--red); color:var(--white);}
  .btn-outline{background:transparent; color:var(--white); border:1px solid rgba(255,255,255,0.6);}
  .btn-outline-dark{background:transparent; color:var(--black); border:1px solid rgba(0,0,0,0.3);}

  /* Header */
  header{position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(17,17,17,0.92); backdrop-filter:blur(6px);}
  .nav{display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:1180px; margin:0 auto;}
  .logo{font-family:var(--serif); font-size:1.25rem; color:var(--white); letter-spacing:0.02em;}
  .logo span{color:var(--red);}
  .logo-group{display:flex; align-items:center; gap:16px;}
  .logo-divider{width:1px; height:32px; background:rgba(255,255,255,0.25);}
  .partner-logo{height:34px; width:auto;}
  .footer-logo{height:52px; width:auto; margin-bottom:24px;}
  .nav-links{display:flex; gap:28px; list-style:none;}
  .nav-links a{color:#ddd; font-size:0.9rem; font-weight:500;}
  .nav-links a:hover{color:var(--white);}
  .nav-cta{display:flex; align-items:center; gap:20px;}
  .nav-cta .btn{padding:10px 20px; font-size:0.85rem;}
  .burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;}
  .burger span{width:24px; height:2px; background:var(--white);}

  /* Hero */
  .hero{position:relative; min-height:100vh; display:flex; align-items:flex-end; overflow:hidden;
    background:#1a1010;}
  .hero-bg{position:absolute; inset:0; background-image:url('/assets/palms.jpg'); background-size:cover; background-position:center;}
  .hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,5,5,0.55) 0%, rgba(10,5,5,0.65) 40%, rgba(10,5,5,0.92) 100%);}
  .hero-inner{position:relative; z-index:2; width:100%; padding:150px 0 48px;}
  .hero-grid{display:grid; grid-template-columns:1.05fr 1fr; gap:48px; align-items:center; margin-bottom:48px;}
  .hero-grid .hero-ctas{margin-bottom:0;}
  .hero .label{color:var(--taupe);}
  .hero h1{color:var(--white); font-size:clamp(2.2rem,5vw,3.6rem); max-width:820px; margin:14px 0 20px;}
  .hero p.sub{color:#e5e0da; max-width:600px; font-size:1.1rem; margin-bottom:32px;}
  .hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:56px;}
  .stats-bar{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; border-top:1px solid rgba(255,255,255,0.15); padding-top:32px;}
  .stat b{display:block; font-family:var(--serif); font-size:1.6rem; color:var(--white); font-weight:500;}
  .stat span{font-size:0.8rem; color:#bbb; text-transform:uppercase; letter-spacing:0.04em;}

  /* Pourquoi Panama */
  .reasons{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
  .reason{padding:28px 24px; background:var(--white); border:1px solid #eee;}
  .reason .num{font-family:var(--serif); font-size:1.8rem; color:var(--red); margin-bottom:10px;}
  .reason h3{font-size:1.15rem; margin-bottom:8px;}
  .reason p{font-size:0.92rem; color:#555;}
  .reason .note{font-size:0.78rem; color:#999; margin-top:8px; font-style:italic;}

  /* Vols */
  table{width:100%; border-collapse:collapse; margin-top:12px;}
  th,td{text-align:left; padding:14px 16px; border-bottom:1px solid #e5ddd2; font-size:0.95rem;}
  th{font-family:var(--sans); font-size:0.75rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--red-dark);}
  .table-wrap{overflow-x:auto;}

  /* Quartiers */
  .quartiers-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  .quartier-card{background:var(--white); padding:24px; border:1px solid #eee;}
  .quartier-card h3{font-size:1.05rem; margin-bottom:8px;}
  .quartier-card p{font-size:0.88rem; color:#555;}

  /* Comment je vous aide */
  .aide-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
  .aide-grid p{color:#444; margin-bottom:16px; font-size:1.02rem;}
  .aide-list{list-style:none;}
  .aide-list li{padding:14px 0; border-bottom:1px solid #eee; font-size:0.98rem; padding-left:28px; position:relative;}
  .aide-list li::before{content:"—"; position:absolute; left:0; color:var(--red);}
  .aide-photo{width:100%; aspect-ratio:3/4; object-fit:cover; object-position:center top; margin-bottom:24px; border-radius:2px;}

  /* Biens cards */
  .biens-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:28px;}
  .bien-card{background:var(--white); border:1px solid #eee; overflow:hidden;}
  .bien-card .photo{aspect-ratio:4/3; overflow:hidden; background:#ddd; position:relative;}
  .bien-card .photo a img{width:100%; height:100%; object-fit:cover;}
  .bien-body{padding:20px;}
  .bien-body .tag{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--red-dark); font-weight:600;}
  .bien-body h3{font-size:1.1rem; margin:6px 0 4px;}
  .bien-body h3 a:hover{text-decoration:underline;}
  .bien-body .price{font-family:var(--serif); font-size:1.2rem; margin-bottom:8px;}
  .bien-body p{font-size:0.88rem; color:#555;}

  .exception-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px;}

  /* Projets */
  .projets-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  .projet-card{background:var(--white); border:1px solid #eee; overflow:hidden;}
  .projet-card .photo{aspect-ratio:16/10; overflow:hidden; background:#ddd; position:relative;}
  .projet-card .photo a img{width:100%; height:100%; object-fit:cover;}
  .projet-body{padding:18px 20px 22px;}
  .projet-body .tag{font-size:0.7rem; color:var(--red-dark); text-transform:uppercase; letter-spacing:0.06em; font-weight:600;}
  .projet-body h3{font-size:1.05rem; margin:6px 0 2px; font-family:var(--serif);}
  .projet-body h3 a:hover{text-decoration:underline;}
  .projet-body .price{font-size:0.95rem; color:var(--black); font-weight:600; margin-bottom:8px;}
  .projet-body .specs{font-size:0.78rem; color:#888; margin-bottom:10px;}
  .projet-body p.desc{font-size:0.85rem; color:#555;}

  /* Badge logo sur les photos de biens/projets */
  .bien-card .photo a, .projet-card .photo a{display:block; width:100%; height:100%;}
  .card-badge{position:absolute; top:12px; left:12px; height:24px; width:auto; z-index:2; filter:drop-shadow(0 1px 3px rgba(0,0,0,0.65));}

  /* Vivre à Panama (pratique) */
  .pratique-grid{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #e5ddd2;}
  .pratique-col{padding:32px 28px; border-left:1px solid #e5ddd2;}
  .pratique-col:first-child{border-left:none;}
  .pratique-col h3{font-size:1.2rem; margin-bottom:16px;}
  .pratique-col ul{list-style:none;}
  .pratique-col li{padding:10px 0; border-top:1px solid #e5ddd2; font-size:0.9rem; color:#444; padding-left:16px; position:relative;}
  .pratique-col li:first-of-type{border-top:none;}
  .pratique-col li::before{content:"—"; position:absolute; left:0; color:var(--red);}

  /* Résidence banner */
  .residence-banner{background:var(--red); color:var(--white); padding:56px 48px; margin-top:56px;}
  .residence-banner h3{font-family:var(--serif); font-size:1.8rem; margin-bottom:12px; color:var(--white);}
  .residence-banner > p{color:rgba(255,255,255,0.9); max-width:640px; margin-bottom:32px;}
  .residence-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  .residence-card{background:rgba(255,255,255,0.12); padding:24px;}
  .residence-card .num{font-size:0.75rem; letter-spacing:0.08em; color:rgba(255,255,255,0.7); margin-bottom:8px;}
  .residence-card h4{font-family:var(--serif); font-size:1.1rem; margin-bottom:4px;}
  .residence-card .amount{font-weight:700; font-size:0.95rem; margin-bottom:10px;}
  .residence-card p{font-size:0.85rem; color:rgba(255,255,255,0.85);}
  .residence-note{font-size:0.78rem; color:rgba(255,255,255,0.65); margin-top:24px; font-style:italic;}

  /* Intelligence de marché */
  .intel-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin:40px 0 48px; border-top:1px solid #e5ddd2; border-bottom:1px solid #e5ddd2; padding:32px 0;}
  .intel-stat b{display:block; font-family:var(--serif); font-size:2.6rem; color:var(--red); font-weight:600; line-height:1;}
  .intel-stat span{font-size:0.82rem; color:#666; text-transform:uppercase; letter-spacing:0.05em;}
  .intel-proof{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:40px;}
  .intel-proof-card{background:var(--white); border:1px solid #eee; padding:24px;}
  .intel-proof-card b{display:block; font-family:var(--serif); font-size:1.6rem; color:var(--black); margin-bottom:6px;}
  .intel-proof-card p{font-size:0.9rem; color:#555;}

  /* Contact */
  #contact{background:var(--black); color:var(--white);}
  .contact-wrap{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
  .contact-intro h2{color:var(--white);}
  .contact-intro p{color:#ccc; font-size:1.05rem;}
  .contact-signature{display:flex; align-items:center; gap:14px; margin-bottom:24px;}
  .contact-signature img{width:52px; height:52px; border-radius:50%; object-fit:cover;}
  .contact-signature .name{font-weight:600; color:var(--white); font-size:0.95rem;}
  .contact-signature .role{font-size:0.8rem; color:#999;}
  form{display:grid; gap:16px;}
  .field label{display:block; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; color:#aaa; margin-bottom:6px;}
  .field input, .field select, .field textarea{width:100%; padding:12px 14px; background:#1c1c1c; border:1px solid #333; color:var(--white); font-family:var(--sans); font-size:0.95rem; border-radius:2px;}
  .field textarea{resize:vertical; min-height:90px;}
  .row2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  form .btn{margin-top:8px; justify-self:start;}
  .form-msg{font-size:0.9rem; color:var(--taupe); margin-top:8px; display:none;}
  .form-err{font-size:0.85rem; color:#ff8a8a; min-height:1.1em;}
  .hp-field{position:absolute; left:-9999px; opacity:0;}
  .consent-c{display:flex; gap:10px; align-items:flex-start; font-size:0.8rem; color:#bbb;}
  .consent-c input{margin-top:3px; accent-color:var(--red);}
  .consent-c a{text-decoration:underline; color:#ddd;}

  /* Footer */
  footer{background:#0a0a0a; color:#999; padding:40px 0; font-size:0.82rem;}
  footer .legal{max-width:820px; margin-bottom:16px; line-height:1.7;}
  footer a{color:var(--taupe);}
  footer a:hover{color:var(--white);}

  @media (max-width:900px){
    .reasons, .quartiers-grid, .exception-grid, .projets-grid, .residence-grid{grid-template-columns:repeat(2,1fr);}
    .aide-grid, .contact-wrap, .intel-proof{grid-template-columns:1fr; gap:32px;}
    .intel-stats{grid-template-columns:1fr; gap:20px;}
    .stats-bar{grid-template-columns:repeat(2,1fr);}
    .hero-grid{grid-template-columns:1fr; gap:32px;}
    .pratique-grid{grid-template-columns:1fr;}
    .pratique-col{border-left:none; border-top:1px solid #e5ddd2;}
    .pratique-col:first-child{border-top:none;}
    .residence-banner{padding:40px 24px;}
  }
  @media (max-width:1020px){
    .nav-links, .nav-cta .btn{display:none;}
    .burger{display:flex;}
  }
  @media (max-width:480px){
    .logo-divider, .partner-logo{display:none;}
  }
  @media (max-width:640px){
    .reasons, .quartiers-grid, .exception-grid, .projets-grid, .residence-grid{grid-template-columns:1fr;}
    .row2{grid-template-columns:1fr;}
    .section{padding:64px 0;}
  }
  .mobile-menu{display:none; position:fixed; inset:0; background:var(--black); z-index:99; padding:100px 24px 24px;}
  .mobile-menu.open{display:flex; flex-direction:column; gap:24px;}
  .mobile-menu a{color:var(--white); font-size:1.3rem; font-family:var(--serif);}
  .btn-wa{background:#1f9d55; color:#fff;}
  .qlink{display:inline-block; margin-top:12px; font-size:.85rem; font-weight:600; color:var(--red); border-bottom:1px solid currentColor;}
  .steps{list-style:none; counter-reset:st; margin:18px 0 0; padding:0;}
  .steps li{counter-increment:st; position:relative; padding:6px 0 6px 40px; color:#333;}
  .steps li::before{content:counter(st); position:absolute; left:0; top:4px; width:26px; height:26px; border-radius:50%; background:var(--red); color:#fff; font-size:.8rem; font-weight:600; display:flex; align-items:center; justify-content:center;}
  .aide-sub{font-family:var(--serif); font-size:1.25rem; margin:28px 0 4px;}
  .free-note{margin-top:14px; padding:12px 14px; background:var(--cream); border-left:3px solid var(--red); font-size:.95rem; color:#333;}
  .proof-line{margin-top:12px; font-size:.92rem; color:#555;}
  .form-note{font-size:.82rem; color:#777; margin:-4px 0 8px;}
  .wa-line{margin-top:20px; color:#555; font-size:.95rem;}
  .wa-line .btn{margin-top:8px;}


/* ===== v2 : pages multiples, boutons arrondis, marges mobiles ===== */
.hero-inner{padding:150px 24px 48px;}                       /* v1 : « padding:150px 0 48px » écrasait la marge de .container -> texte collé aux bords du téléphone */
.btn{border-radius:999px; padding:14px 30px;}
.btn-red{box-shadow:0 6px 18px rgba(237,28,36,.28);}
.btn-outline,.btn-outline-dark{border-width:1.5px;}
.nav-cta .btn{padding:10px 22px;}
.reason,.quartier-card,.intel-proof-card,.bien-card,.projet-card{border-radius:16px;}
.pratique-grid{border-radius:16px; overflow:hidden;}
.residence-banner{border-radius:20px;}
.residence-card{border-radius:14px;}
.free-note{border-radius:0 12px 12px 0;}
.field input,.field select,.field textarea{border-radius:10px;}
.table-wrap{border-radius:12px;}
h2{text-wrap:balance;}
#pq-card .pq-btn,#pq-results .pq-btn{border-radius:999px; padding:14px 28px;}
#pq-card .pq-chip,#pq-results .pq-chip{border-radius:12px;}
#pq-card select.pq-select,#pq-results select.pq-select,#pq-results .pq-form input,#pq-results .pq-form select{border-radius:10px;}
.pq-card{border-radius:20px !important;}

/* navigation */
.nav{gap:16px;}
.nav-links{gap:22px; align-items:center;}
.nav-links a{font-size:.88rem; white-space:nowrap; padding:6px 0; border-bottom:2px solid transparent;}
.nav-links a[aria-current="page"]{color:#fff; border-bottom-color:var(--red);}
.has-sub{position:relative;}
.has-sub > a::after{content:""; display:inline-block; margin-left:7px; border:4px solid transparent; border-top-color:currentColor; transform:translateY(2px);}
.sub{display:none; position:absolute; top:100%; left:-16px; min-width:200px; background:rgba(17,17,17,.98); padding:12px 0 10px; border-radius:0 0 14px 14px; list-style:none; box-shadow:0 14px 30px rgba(0,0,0,.35);}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:block;}
.sub a{display:block; padding:9px 22px; border-bottom:0 !important;}
.sub a:hover{background:rgba(255,255,255,.07);}
.logo-group{flex-shrink:0;}
.mobile-menu{overflow:auto;}
.mobile-menu a{font-size:1.25rem;}
.mobile-menu .m-sub{display:flex; flex-direction:column; gap:12px; padding-left:18px; margin-top:-8px;}
.mobile-menu .m-sub a{font-size:1.02rem; font-family:var(--sans); color:#ccc;}
.mobile-menu .m-ctas{display:flex; flex-direction:column; gap:12px; margin-top:8px;}
.mobile-menu .m-ctas .btn{text-align:center; font-family:var(--sans); font-size:1rem;}

/* en-tête des pages intérieures */
.page-hero{position:relative; padding:140px 0 60px; background:#1a1010; overflow:hidden;}
.page-hero::before{content:""; position:absolute; inset:0; background:url('/assets/palms.jpg') center/cover; opacity:.55;}
.page-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,5,5,.55),rgba(10,5,5,.88));}
.page-hero .container{position:relative; z-index:2;}
.page-hero .label{color:var(--taupe);}
.page-hero h1{color:#fff; font-size:clamp(2rem,4.6vw,3.2rem); margin:12px 0 14px; max-width:860px; text-wrap:balance;}
.page-hero p{color:#e5e0da; font-size:1.08rem; max-width:680px;}
.page-hero .crumbs{font-size:.8rem; color:#bbb; margin-bottom:14px;}
.page-hero .crumbs a{color:#ddd; text-decoration:underline;}

/* accueil : cartes vers les pages */
.hub-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.hub-card{display:block; background:#fff; border:1px solid #e9e3d9; border-radius:18px; padding:28px 26px 26px; transition:transform .18s, box-shadow .18s;}
.hub-card:hover{transform:translateY(-3px); box-shadow:0 14px 34px rgba(0,0,0,.08);}
.hub-card .num{font-size:.75rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--red);}
.hub-card h3{font-size:1.4rem; margin:8px 0 8px;}
.hub-card p{color:#555; font-size:.95rem;}
.hub-card .go{display:inline-block; margin-top:14px; font-weight:600; font-size:.9rem; color:var(--red);}
.more-link{display:inline-block; margin-top:28px; font-weight:600; color:var(--red); border-bottom:1.5px solid currentColor;}
.home-about{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.home-about p{color:#444; font-size:1.02rem; margin-bottom:16px;}
.home-about .aide-sub{margin-top:0;}
.aide-steps{grid-column:1 / -1;}

/* bandeau de fin de page */
.cta-band{background:var(--cream); padding:64px 0; text-align:center;}
.cta-band h2{margin-top:0;}
.cta-band p{color:#555; max-width:560px; margin:0 auto 26px;}
.cta-band .btns{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

/* tableau des prix */
.price-table{max-width:760px;}
.price-table td.num,.price-table th.num{text-align:right; white-space:nowrap;}
.price-table .dim{color:#aaa;}
.table-note{font-size:.82rem; color:#777; margin-top:12px; max-width:760px;}
.key-sentence{font-family:var(--serif); font-size:1.35rem; line-height:1.35; max-width:760px; margin:0 0 28px;}

/* témoignages */
.testi-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:24px;}
.testi{background:#fff; border:1px solid #eee; border-radius:16px; padding:30px 28px 26px; position:relative;}
.testi::before{content:"\201C"; position:absolute; top:6px; left:22px; font-family:var(--serif); font-size:4rem; line-height:1; color:var(--red); opacity:.35;}
.testi blockquote{font-family:var(--serif); font-size:1.18rem; line-height:1.5; color:#222; margin:18px 0 18px;}
.testi figcaption{font-size:.85rem; color:#666;}
.testi figcaption b{display:block; color:#111; font-size:.95rem;}
.cta-band{border-top:1px solid #e5ddd2;}
.testi-grid.c3{grid-template-columns:repeat(3,1fr);}
.testi blockquote{font-size:1.08rem;}
@media (max-width:900px){ .testi-grid,.testi-grid.c3{grid-template-columns:1fr;} }
/* pied de page */
.foot-links{display:flex; flex-wrap:wrap; gap:8px 22px; margin:0 0 22px;}
.foot-links a{font-size:.9rem;}

/* barre fixe du téléphone */
.mbar{display:none;}
@media (max-width:700px){
  .mbar{display:flex; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:90; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(17,17,17,.96); backdrop-filter:blur(6px);}
  .mbar .btn{flex:1; display:flex; align-items:center; justify-content:center; text-align:center; line-height:1.15; padding:11px 10px; font-size:.9rem; box-shadow:none;}
  body{padding-bottom:74px;}
  body.menu-open .mbar{display:none;}
}
@media (max-width:900px){
  .hub-grid{grid-template-columns:repeat(2,1fr);}
  .home-about{grid-template-columns:1fr; gap:28px;}
}
@media (max-width:640px){
  .container{padding:0 20px;}
  .hero-inner{padding:110px 20px 36px;}
  .page-hero{padding:112px 0 44px;}
  .hub-grid{grid-template-columns:1fr;}
  .hero-ctas .btn,.cta-band .btn{width:100%; text-align:center;}
  .nav{padding:14px 20px;}
  .residence-banner{padding:32px 22px;}
  .cta-band{padding:48px 0;}
}