:root{
  --paper:#eee0bf; --paper2:#e4d4ab; --paper-line:rgba(42,34,23,.18);
  --ink:#2a2217; --ink-soft:#5c4f3b;
  --accent:#a3382c; --accent-soft:#7a3b2e;
  --serif:'Newsreader',Georgia,serif;
  --mono:'Courier Prime','Courier New',monospace;
}
*{box-sizing:border-box}
@media (prefers-reduced-motion:no-preference){ html{scroll-behavior:smooth} }
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);line-height:1.6;
  background-image:radial-gradient(ellipse 900px 700px at 18% 0%,rgba(255,250,232,.35),transparent 60%),
    radial-gradient(ellipse 1000px 800px at 100% 100%,rgba(90,70,30,.10),transparent 55%),
    repeating-linear-gradient(0deg,transparent,transparent 34px,var(--paper-line) 34px,var(--paper-line) 35px)}
a{color:var(--accent)}
a:hover{color:var(--accent-soft)}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(min-width:900px){
  body::before{content:"";position:fixed;top:0;bottom:0;left:52px;width:1px;background:rgba(163,56,44,.3);z-index:1;pointer-events:none}
}
.wrap{max-width:900px;margin:0 auto;padding:0 22px}
h1,h2,h3{line-height:1.35;margin:0 0 .35em;font-weight:600}
h2{font-size:1.7rem;font-style:italic;border-top:1px solid var(--ink-soft);padding-top:14px;display:inline-block}
.sub-heading{font-size:1.25rem;font-style:italic;margin-top:40px;border-top:1px dotted var(--paper-line);padding-top:24px}
section{padding:46px 0;border-top:1px solid var(--paper-line)}
.lead{color:var(--ink-soft);font-size:1.06rem;max-width:64ch}

.masthead{background:#efe3cc;border-bottom:1px solid var(--paper-line);font-family:var(--mono);font-size:.82rem;letter-spacing:.03em;color:var(--accent-soft);text-align:center;padding:10px 16px}

header{position:sticky;top:0;z-index:50;background:rgba(242,233,216,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--paper-line)}
nav{display:flex;align-items:center;justify-content:space-between;min-height:60px;flex-wrap:wrap;padding:6px 0}
.brand{font-family:var(--mono);font-weight:700;letter-spacing:.06em;font-size:1.05rem;color:var(--ink)}
.brand b{color:var(--accent)}
.navlinks{display:flex;gap:4px;flex-wrap:wrap}
.navlinks a{color:var(--ink-soft);font-family:var(--mono);font-size:.82rem;letter-spacing:.02em;line-height:1.4;padding:13px 10px;display:inline-block}
.navlinks a:hover, .navlinks a.active{color:var(--accent)}
.menubtn{display:none;background:none;border:1px solid var(--ink-soft);color:var(--ink);font-family:var(--mono);font-size:.85rem;line-height:1.4;padding:9px 14px;cursor:pointer;min-width:44px;min-height:44px}

.hero{position:relative;padding:54px 0 64px}
.hero-top{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);flex-wrap:wrap;border-bottom:1px solid var(--ink-soft);padding-bottom:10px;margin-bottom:34px}
.hero-cols{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap}
.call{font-family:var(--serif);font-style:italic;font-weight:600;font-size:clamp(3rem,9vw,5.6rem);margin:0;color:var(--ink);transform:rotate(-0.6deg);display:inline-block}
.hero .claim{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--accent-soft);max-width:48ch;margin:18px 0 0}
.hero .loc{color:var(--ink-soft);margin-top:.5em;font-size:1rem}
.cta{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;font-family:var(--mono);font-size:.85rem;line-height:1.4;letter-spacing:.02em;border:1px solid var(--ink);color:var(--ink);min-height:44px}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:var(--accent-soft);color:var(--paper)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent)}

.stamp{border:2.5px solid var(--accent);border-radius:50%;width:160px;height:160px;flex:none;display:flex;align-items:center;justify-content:center;transform:rotate(-11deg);opacity:.88;text-align:center;font-family:var(--mono);color:var(--accent);padding:18px;box-sizing:border-box}
.stamp .top{font-size:.72rem;letter-spacing:.1em;border-bottom:1.5px solid var(--accent);padding-bottom:4px;margin-bottom:4px}
.stamp .call2{font-size:1rem;font-weight:700;letter-spacing:.04em}
.stamp .sub{font-size:.72rem;letter-spacing:.08em;margin-top:3px}
.stamp.small{width:124px;height:124px;padding:12px;flex-shrink:0}
.stamp.small .top{font-size:.7rem;padding-bottom:3px;margin-bottom:3px}
.stamp.small .call2{font-size:.82rem}
.stamp.small .sub{font-size:.7rem}
.diplomas-row{display:flex;gap:30px;align-items:flex-start;flex-wrap:wrap}
.diplomas-row ul{flex:1 1 360px}

.figures{display:flex;gap:36px;margin-top:38px;flex-wrap:wrap;font-family:var(--mono)}
.figures .n{display:block;font-size:1.5rem;font-weight:700;color:var(--ink)}
.figures .l{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

.cols{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:start}
.card{background:var(--paper2);border:1px solid var(--paper-line);padding:22px 24px}
.card h3{font-size:1.05rem;font-style:italic}
.inline-code{font-family:var(--mono);font-size:.82em;background:var(--paper);border:1px solid var(--paper-line);padding:1px 5px}
.shot-placeholder{margin-top:16px;border:1.5px dashed rgba(42,34,23,.4);background:var(--paper);padding:34px 20px;text-align:center;font-family:var(--mono);font-size:.78rem;color:var(--ink-soft)}
.screenshot{margin:16px 0 0;padding:0}
.screenshot img{width:100%;height:auto;display:block;border:1px solid rgba(42,34,23,.35);box-shadow:3px 4px 10px rgba(42,34,23,.18)}
.screenshot figcaption{margin-top:8px;font-family:var(--mono);font-size:.78rem;color:var(--ink-soft)}
.inline-list{margin-top:12px;color:var(--ink-soft);font-family:var(--mono);font-size:.85rem}

.group-label{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:22px 0 2px}
.group-label:first-child{margin-top:0}
.specs{list-style:none;padding:0;margin:0}
.specs li{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--paper-line);font-size:.92rem}
.specs li:last-child{border-bottom:0}
.specs .k{color:var(--ink-soft)}
.specs .v{font-family:var(--mono);color:var(--ink);text-align:right}

.bands{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;font-family:var(--mono)}
.band{font-size:.85rem;border:1px solid var(--paper-line);background:var(--paper2);padding:8px 14px}
.band b{color:var(--accent)}
.modes{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;font-family:var(--mono)}
.mode{font-size:.78rem;color:var(--ink-soft);border:1px solid var(--paper-line);padding:5px 10px}

.diploma-list{columns:2;column-gap:28px;margin-top:20px;font-family:var(--mono);font-size:.85rem}
.diploma-list li{break-inside:avoid;padding:7px 0;border-bottom:1px dotted var(--paper-line);color:var(--ink-soft)}
.diploma-list b{color:var(--ink)}
.cert-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:26px}
.cert{background:#f5ecd6;border:1px solid var(--paper-line);padding:18px 20px;position:relative;transform:rotate(-0.6deg);box-shadow:3px 4px 9px rgba(42,34,23,.14)}
.cert:nth-child(even){transform:rotate(0.6deg)}
.cert .label{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.cert .title{font-style:italic;font-weight:600;font-size:1.25rem;margin-top:6px}
.cert .meta{font-family:var(--mono);font-size:.78rem;color:var(--ink-soft);margin-top:6px}

.log-filters{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:24px;font-family:var(--mono);font-size:.82rem;color:var(--ink-soft)}
.log-filters select{font-family:var(--mono);font-size:.82rem;background:var(--paper2);border:1px solid var(--paper-line);padding:6px 8px;color:var(--ink)}
.log-count{margin-left:auto;font-size:.78rem}
.log-table-wrap{overflow-x:auto;margin-top:16px}
.log-table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.82rem;min-width:620px}
.log-table th{text-align:left;text-transform:uppercase;letter-spacing:.06em;font-size:.7rem;color:var(--ink-soft);border-bottom:1px solid var(--ink-soft);padding:8px 10px}
.log-table td{padding:8px 10px;border-bottom:1px dotted var(--paper-line)}
.log-note{font-family:var(--mono);font-size:.76rem;color:var(--ink-soft);margin-top:14px}

#dxcc-map .leaflet-tile-pane{filter:sepia(45%) saturate(65%) brightness(97%)}
#dxcc-map .leaflet-popup-content{font-family:var(--serif)}
#dxcc-map .leaflet-popup-content-wrapper{background:var(--paper2);color:var(--ink)}
#dxcc-map .leaflet-popup-tip{background:var(--paper2)}
#dxcc-map .leaflet-control-attribution{padding:2px 8px;font-size:.72rem}

.log-entries{display:flex;flex-direction:column;gap:34px;margin-top:28px}
.log-date{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;color:var(--accent)}
.log-title{font-style:italic;font-size:1.15rem;margin-top:2px}

.shack-row{display:flex;gap:30px;margin-top:30px;flex-wrap:wrap}
.shack-photo{width:300px;position:relative}
.shack-photo .tape{position:absolute;top:-8px;left:50%;transform:translateX(-50%) rotate(-3deg);width:48px;height:16px;background:rgba(238,224,191,.75);border:1px solid rgba(42,34,23,.2);z-index:2}
.shack-photo img{width:100%;height:auto;display:block;border:1px solid rgba(42,34,23,.35);box-shadow:3px 4px 9px rgba(42,34,23,.18)}
.shack-caption{font-family:var(--mono);font-size:.78rem;color:var(--ink-soft);text-align:center;margin-top:8px}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.ccard{background:var(--paper2);border:1px solid var(--paper-line);padding:24px}
.ccard .big{font-family:var(--mono);font-size:1.1rem;color:var(--accent);word-break:break-all}
.links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;font-family:var(--mono)}
.links a{font-size:.82rem;line-height:1.4;border:1px solid var(--paper-line);padding:8px 12px;color:var(--ink);min-height:44px;display:inline-flex;align-items:center}
.links a:hover{border-color:var(--accent)}

.totop{position:fixed;right:18px;bottom:18px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:.78rem;padding:10px 14px;border:1px solid var(--ink);opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}
.totop:hover{color:var(--paper);background:var(--accent-soft);border-color:var(--accent-soft)}
.totop.show{opacity:.92;pointer-events:auto}

footer{border-top:1px solid var(--paper-line);padding:30px 0;color:var(--ink-soft);font-size:.85rem;text-align:center;font-family:var(--mono)}
footer .brand{font-size:.95rem}
footer p{margin:.4em 0}
.visit-counter{margin-top:14px;font-size:.78rem;color:var(--ink-soft)}
.visit-counter .flags{display:inline-flex;gap:6px;margin-left:8px;vertical-align:middle}
.visit-counter .flags span{border:1px solid var(--paper-line);padding:1px 6px;background:var(--paper2)}

/* Índice de páginas (home) */
.page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.page-card{background:var(--paper2);border:1px solid var(--paper-line);padding:20px;display:block;color:var(--ink);text-decoration:none}
.page-card:hover{border-color:var(--accent)}
.page-card .n2{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.page-card h3{font-style:italic;font-size:1.1rem;margin-top:6px}
.page-card p{color:var(--ink-soft);font-size:.88rem;margin:6px 0 0}

/* Herramientas */
.tool{background:var(--paper2);border:1px solid var(--paper-line);padding:24px;margin-top:22px}
.tool h3{font-style:italic;font-size:1.2rem}
.tool-row{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end;margin-top:16px}
.tool-row label{display:flex;flex-direction:column;gap:5px;font-family:var(--mono);font-size:.78rem;color:var(--ink-soft);letter-spacing:.03em}
.tool-row input{font-family:var(--mono);font-size:.92rem;padding:9px 10px;border:1px solid var(--paper-line);background:var(--paper);color:var(--ink);min-width:140px}
.tool-row input:focus-visible{outline:2px solid var(--accent)}
.tool-result{margin-top:18px;font-family:var(--mono);font-size:.95rem;padding:14px 16px;background:var(--paper);border:1px dashed rgba(42,34,23,.35);min-height:1.4em;color:var(--ink)}
.tool-result b{color:var(--accent)}
.tool-note{font-family:var(--mono);font-size:.82rem;color:var(--ink-soft);margin-top:10px}

/* Márgenes: el hueco a cada lado de la columna de 900px se reparte a partes
   iguales entre "aire hasta el contenido" y "aire hasta el borde de la ventana"
   (≈55px cada uno en el punto de corte), para que el widget no quede ni pegado
   al texto ni pegado al borde de la pantalla. Cada breakpoint se calcula para
   ese reparto, no para el mínimo técnico en que "cabe de milagro". */
.side-cluster{position:fixed;top:120px;left:calc(50% + 505px);width:320px;z-index:30;border:1px solid var(--paper-line);background:var(--paper2);padding:10px 10px 4px;box-shadow:3px 4px 9px rgba(42,34,23,.16);display:none}
.side-cluster .label{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;text-align:center}
.side-cluster iframe{display:block;border:0}
@media(min-width:1760px){ .side-cluster{display:block} }

.flag-corner{position:fixed;top:14px;z-index:55;text-align:center;display:none}
.flag-corner.left{left:20px}
.flag-corner.right{right:20px}
.flag-corner img{width:72px;height:48px;display:block;border:1px solid rgba(42,34,23,.35);box-shadow:2px 3px 7px rgba(42,34,23,.18);filter:url(#ondea)}
.flag-corner figcaption{margin-top:4px;font-family:var(--mono);font-size:.7rem;color:var(--ink-soft)}
@media(min-width:1280px){ .flag-corner{display:block} }
@media(prefers-reduced-motion:reduce){ .flag-corner img{filter:none} }

.side-prop{position:fixed;top:120px;left:calc(50% - 719px);width:184px;z-index:30;border:1px dashed rgba(163,56,44,.5);background:rgba(245,236,214,.75);padding:14px 14px 12px;transform:rotate(-0.6deg);display:none;text-align:center}
.side-prop .label{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.side-prop img{width:100%;height:auto;display:block;border:1px solid rgba(42,34,23,.25)}
.side-prop .clock{font-family:var(--mono);font-size:1.1rem;color:var(--ink);margin-top:10px;border-top:1px dotted rgba(42,34,23,.3);padding-top:8px}
@media(min-width:1600px){
  .side-prop{display:block}
  body::before{display:none} /* la regla roja del margen se la come el propio widget */
}

/* "Recorte pegado" de un servicio externo (p. ej. el log de QRZ) */
.clipping{background:#f5ecd6;border:1px solid var(--paper-line);padding:14px;margin-top:26px;max-width:680px;transform:rotate(-0.8deg);box-shadow:3px 4px 10px rgba(42,34,23,.16);position:relative}
.clipping .tape{position:absolute;top:-9px;left:40px;width:52px;height:17px;background:rgba(238,224,191,.75);border:1px solid rgba(42,34,23,.2);transform:rotate(-4deg)}
.clipping .tape.r{left:auto;right:40px;transform:rotate(4deg)}
.clipping iframe{width:100%;border:1px solid rgba(42,34,23,.25);display:block;max-width:640px}
.clipping-caption{font-family:var(--mono);font-size:.76rem;color:var(--ink-soft);margin-top:8px;text-align:center}

@media(max-width:780px){
  .navlinks{display:none;width:100%}.menubtn{display:inline-block}
  .navlinks.open{display:flex;flex-direction:column;width:100%;border-top:1px solid var(--paper-line);margin-top:10px}
  .navlinks a{padding:13px 4px}
  .cols{grid-template-columns:1fr}
  .hero-cols{flex-direction:column}
  .contact{grid-template-columns:1fr}
  .diploma-list{columns:1}
  .stamp{transform:rotate(-6deg)}
  .page-grid{grid-template-columns:1fr}
}
