@font-face{font-family:"Jost";src:url("https://assets.pedasioceanproperties.com/brand/fonts/jost-latin.woff2") format("woff2");font-weight:200 500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Jost";src:url("https://assets.pedasioceanproperties.com/brand/fonts/jost-latin-ext.woff2") format("woff2");font-weight:200 500;font-style:normal;font-display:swap;unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";src:url("https://assets.pedasioceanproperties.com/brand/fonts/cormorant-garamond-latin.woff2") format("woff2");font-weight:300 400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Cormorant Garamond";src:url("https://assets.pedasioceanproperties.com/brand/fonts/cormorant-garamond-latin-ext.woff2") format("woff2");font-weight:300 400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";src:url("https://assets.pedasioceanproperties.com/brand/fonts/cormorant-garamond-italic-latin.woff2") format("woff2");font-weight:300 400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Cormorant Garamond";src:url("https://assets.pedasioceanproperties.com/brand/fonts/cormorant-garamond-italic-latin-ext.woff2") format("woff2");font-weight:300 400;font-style:italic;font-display:swap;unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

:root{--navy:#0c1d35;--gold:#c9a96e;--gold-deep:#876c3a;--cream:#faf7f2;
  --paper:#ffffff;--ink:#16202e;--soft:#46535f;--rule:#ddd4c6}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:300;font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased;
  font-variant-numeric:lining-nums tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}

h1,h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;margin:0;
  line-height:1.14;text-wrap:balance;
  font-variant-numeric:lining-nums tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}

.shell{width:min(100% - 48px, 820px);margin-inline:auto}

/* --- cabecera --- */
.masthead{background:var(--navy);color:var(--cream);padding:76px 0 68px;margin-bottom:64px}
.masthead h1{font-size:clamp(2.4rem,6vw,3.6rem);color:var(--cream);margin:18px 0 0}
.eyebrow{font-size:.7rem;letter-spacing:4.5px;text-transform:uppercase;
  color:var(--gold);margin:0;font-weight:300}
.lead{margin:26px 0 0;max-width:46ch;color:rgba(250,247,242,.82);font-size:1.02rem}

/* --- secciones --- */
main{padding-bottom:96px}
section{margin:0 0 60px}
section:last-child{margin-bottom:0}
.num{font-size:.7rem;letter-spacing:3.4px;color:var(--gold-deep);margin:0 0 10px;
  font-weight:400}
h2{font-size:clamp(1.6rem,3.4vw,2.1rem);color:var(--navy)}
h2+p{margin-top:20px}
h3{font-family:"Jost",sans-serif;font-weight:400;font-size:.76rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-deep);margin:34px 0 0}
h3+p{margin-top:10px}
p{margin:18px 0 0;max-width:68ch;text-wrap:pretty}
strong{font-weight:500;color:var(--navy)}
em{font-style:italic}
a{color:var(--gold-deep);text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:2px}
a:hover{color:var(--navy)}
.note{font-size:.9rem;color:var(--soft);border-left:2px solid var(--rule);
  padding-left:16px;margin-top:22px}

/* --- tablas de datos --- */
.datos{width:100%;border-collapse:collapse;margin:24px 0 0;font-size:.95rem}
.datos th,.datos td{text-align:left;vertical-align:top;padding:11px 0;
  border-bottom:1px solid var(--rule)}
.datos th{font-weight:400;color:var(--soft);width:34%;padding-right:20px;
  font-size:.78rem;letter-spacing:.09em;text-transform:uppercase}
.datos td{color:var(--ink)}
@media(max-width:560px){
  .datos th,.datos td{display:block;width:100%;padding:0}
  .datos th{border:0;padding-top:14px}
  .datos td{padding:2px 0 12px;border-bottom:1px solid var(--rule)}
}

.colofon{border-top:1px solid var(--rule);padding-top:52px}

/* ===== EXPLORE =====
   Solo lo que la envoltura de /about/ no traia: fotos e indice. Todo lo
   demas -tipografias, tokens, .masthead, .shell, .datos, .note- es suyo. */
figure{margin:44px 0 0}
/* width:auto, no width:100%. Dos de estas fotos son pequenas de origen -453 y
   504 px de ancho- y estiradas a los 820 de la columna se ven blandas. Asi
   ocupan lo suyo y quedan ancladas a la izquierda, que es justamente lo que
   pide el sistema: asimetria, nada centrado por defecto. */
figure img{display:block;width:auto;max-width:100%;height:auto}
figcaption{margin-top:14px;font-size:.86rem;line-height:1.6;color:var(--soft);
  max-width:62ch}

/* El indice. Mismo patron que .vias del cierre del dossier: rotulo dorado
   diminuto arriba, nombre en Cormorant debajo. Sin recuadro y sin flecha. */
.indice{list-style:none;margin:54px 0 0;padding:0;
  display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
@media(min-width:720px){.indice{grid-template-columns:repeat(2,minmax(0,1fr));gap:46px 52px}}
.indice a{display:flex;flex-direction:column;gap:9px;text-decoration:none;
  color:var(--ink);transition:color .3s ease}
.indice a:hover{color:var(--gold-deep)}
.indice a:focus-visible{outline:1px solid var(--gold-deep);outline-offset:6px}
.indice .lbl{font-size:.64rem;letter-spacing:2.2px;text-transform:uppercase;
  color:var(--gold-deep)}
.indice .val{font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;
  font-size:1.52rem;line-height:1.18}
.indice p{margin:2px 0 0;font-size:.92rem;line-height:1.62;color:var(--soft)}

/* ===== el video =====
   Mientras no se pulsa esto es una foto y nada mas. El rotulo usa la misma
   letra que el resto: Jost ligera, versalitas, espaciada. Esquinas rectas y
   filete dorado, como el boton del header: el sistema no rellena, filetea. */
.cine{margin:44px 0 0}
.cine-play{display:block;width:100%;padding:0;border:0;background:none;
  cursor:pointer;position:relative;line-height:0}
.cine-play img{display:block;width:100%;height:auto}
.cine-rotulo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:"Jost",sans-serif;font-weight:300;font-size:.68rem;
  letter-spacing:2.6px;text-transform:uppercase;
  color:var(--cream);border:1px solid var(--gold);
  padding:13px 30px;background:rgba(12,29,53,.34);
  transition:background-color .3s ease,color .3s ease}
.cine-play:hover .cine-rotulo{background:var(--gold);color:var(--navy)}
.cine-play:focus-visible{outline:1px solid var(--gold-deep);outline-offset:4px}
.cine iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0}

/* Volver, al pie de cada pagina. */
.volver{margin-top:64px;padding-top:28px;border-top:1px solid var(--rule);
  display:flex;gap:26px;flex-wrap:wrap}
.volver a{font-size:.68rem;letter-spacing:2.2px;text-transform:uppercase;
  color:var(--gold-deep);text-decoration:none;transition:opacity .3s ease}
.volver a:hover{opacity:.62}