:root{
    --bg:#fbf9f4;
    --bg-warm:#f4efe7;
    --paper:#ffffff;
    --ink:#1c1a17;
    --ink-soft:#4a4540;
    --ink-mute:#736d60;
    --line:#e8e1d6;
    --line-soft:#f0ebe2;
    --accent:#e7624f;       /* coral del logo */
    --accent-deep:#cf4030;  /* coral más oscuro para hover y contraste */
    --accent-soft:#fbe2db;
    --accent-tint:#fdf1ee;
    --black:#15130f;
    --gold:#c0892f;
    --shadow-sm:0 1px 2px rgba(40,30,15,.03), 0 3px 10px -5px rgba(40,30,15,.045);
    --shadow-md:0 1px 3px rgba(40,30,15,.03), 0 6px 18px -8px rgba(40,30,15,.07);
    --shadow-lg:0 4px 16px -8px rgba(40,30,15,.055), 0 18px 44px -20px rgba(40,30,15,.11);
    --serif:'Poppins', system-ui, sans-serif;   /* display / headings (matches logo) */
    --sans:'Mulish', system-ui, sans-serif;       /* body */
    --r:18px;
    --r-sm:13px;
    --ease:cubic-bezier(.22,.68,.16,1);
    --maxw:1180px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:var(--sans);
    background:var(--bg);
    color:var(--ink);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    overflow-x:hidden;
  }
  ::selection{background:var(--accent-soft);color:var(--accent-deep)}
  a{color:inherit;text-decoration:none}
  button{font-family:inherit;cursor:pointer;border:none;background:none}
  /* Accesibilidad: anillo de foco visible solo para navegación por teclado */
  :focus-visible{outline:2.5px solid var(--accent);outline-offset:2px;border-radius:4px}
  /* Respeta a quienes prefieren menos movimiento */
  @media (prefers-reduced-motion: reduce){
    *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
       transition-duration:.001ms !important;scroll-behavior:auto !important}
  }
  /* TOUCH: remove iOS 300ms tap delay and make all interactive elements respond
     reliably to taps. Any element with an onclick handler is treated as tappable. */
  button,a,.area-cell,.card-feat,.link-more,.lawyer-row h3,.firm-logo,
  [onclick]{touch-action:manipulation;-webkit-tap-highlight-color:rgba(231,98,79,.12)}
  [onclick]{cursor:pointer}
  img{display:block;max-width:100%}
  /* MOBILE-FIRST SAFETY: flex/grid children may shrink below content width
     (prevents fixed-width children from forcing horizontal overflow),
     and long words/URLs wrap instead of pushing the layout wide. */
  *{min-width:0}
  h1,h2,h3,h4{overflow-wrap:break-word}
  /* GLOBAL SVG SAFETY: any inline svg without an explicit size fills its
     parent box (max 100%), never its intrinsic 300x150 default. This makes
     icon sizing fully controlled by the parent's width/height. */
  svg{display:block;max-width:100%;max-height:100%}
  .link-more svg, .vp svg, .ml svg, .seeall svg, .howto svg, .more svg, .fact .ft + svg{width:15px;height:15px;flex:none}
  .filter-bar .sw .chev svg{width:12px;height:12px}
  .area-ic svg{width:100%;height:100%}
  .serif{font-family:var(--serif)}
  /* Display headings (Poppins): consistent tracking + weight across the site */
  .hero h1, .head-row h2, .listing-head h1, .profile-main h1,
  .firm-hero .fhmain h1, .tab-panel h2, .firm-about h2{letter-spacing:-.02em}
  .card-feat h3, .lawyer-row h3, .cta-band h3, .profile-cta h3,
  .prac-card h3, .spec-box h3, .mini-card h3, .search-card h3,
  .tl-item h4, .firm-card .fmeta .nm{letter-spacing:-.01em}

  /* ---------- Layout ---------- */
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .view{display:none;animation:fade .5s ease both}
  .view.active{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  /* ---------- Logo (official wordmark: serif, terracotta A + C) ---------- */
  /* Logo = official wordmark image (transparent PNG, blends on any bg) */
  .logo{display:inline-flex;align-items:center;line-height:0}
  .logo img{height:29px;width:auto;display:block}
  /* AC monogram (footer / compact contexts) */
  .logo-mark{display:inline-flex;align-items:center;line-height:0}
  .logo-mark img{height:19px;width:auto;display:block}

  /* ---------- Header ---------- */
  #hdr{position:sticky;top:0;z-index:100;background:rgba(251,249,244,.9);
         backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
         border-bottom:1px solid transparent;transition:border-color .3s, background .3s}
  #hdr.scrolled{border-color:var(--line);background:var(--bg)}
  .nav{display:flex;align-items:center;gap:14px;height:82px}
  .nav-logo{display:flex;align-items:center;cursor:pointer;margin-left:14px}
  .nav-logo .logo{font-size:26px}
  .nav-links{display:flex;align-items:center;gap:12px;margin-left:auto}
  .nav-links a{font-size:15px;font-weight:600;color:var(--ink-soft);position:relative;letter-spacing:-.005em;
               display:flex;align-items:center;gap:5px;padding:9px 15px;border-radius:9px;
               transition:color .2s, background .2s}
  .nav-links a:hover{color:var(--ink);background:var(--bg-warm)}
  .nav-links a .chev{width:9px;opacity:.55;transition:transform .2s}
  .nav-links a:hover .chev{transform:translateY(1px)}
  /* Dropdown "Ayuda": aparece en hover/focus, hereda estilos del nav-links */
  .nav-drop{position:relative}
  .nav-drop-trigger{font-size:15px;font-weight:600;color:var(--ink-soft);letter-spacing:-.005em;
       display:flex;align-items:center;gap:5px;padding:9px 15px;border-radius:9px;cursor:pointer;
       transition:color .2s, background .2s}
  .nav-drop:hover .nav-drop-trigger,
  .nav-drop:focus-within .nav-drop-trigger{color:var(--ink);background:var(--bg-warm)}
  .nav-drop-chev{width:10px;height:10px;opacity:.6;transition:transform .2s}
  .nav-drop:hover .nav-drop-chev,
  .nav-drop:focus-within .nav-drop-chev{transform:rotate(180deg);opacity:.85}
  .nav-drop-menu{position:absolute;top:calc(100% - 2px);right:0;background:var(--paper);
       border:1px solid var(--line);border-radius:12px;padding:7px;min-width:280px;
       box-shadow:0 14px 36px -10px rgba(40,30,15,.18), 0 2px 6px rgba(40,30,15,.06);
       opacity:0;visibility:hidden;transform:translateY(-6px);
       transition:opacity .18s ease, transform .18s ease, visibility .18s;z-index:60}
  .nav-drop:hover .nav-drop-menu,
  .nav-drop:focus-within .nav-drop-menu{opacity:1;visibility:visible;transform:translateY(2px)}
  .nav-drop-menu a{display:block;padding:10px 13px;border-radius:8px;font-size:14px;
       color:var(--ink);font-weight:500;cursor:pointer;letter-spacing:-.005em;
       white-space:nowrap;transition:background .15s, color .15s}
  .nav-drop-menu a:hover{background:var(--bg-warm);color:var(--accent)}
  .btn-pro{background:var(--black);color:#fff;font-weight:700;font-size:14px;margin-left:6px;
           padding:11px 20px;border-radius:10px;transition:transform .2s, background .2s, box-shadow .2s}
  .btn-pro:hover{background:var(--accent);transform:translateY(-1px);box-shadow:0 6px 18px rgba(231,98,79,.26)}
  .burger{display:none;margin-left:auto;flex-direction:column;justify-content:center;gap:5px;padding:8px;width:40px;height:40px}
  .burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:transform .35s cubic-bezier(.65,.05,.36,1),opacity .25s ease}
  .burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger.is-open span:nth-child(2){opacity:0}
  .burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* ---------- Buttons ---------- */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
       font-weight:600;font-size:15px;padding:14px 26px;border-radius:12px;letter-spacing:.01em;
       transition:transform .24s var(--ease), box-shadow .24s var(--ease), background .24s var(--ease), border-color .24s var(--ease), color .24s var(--ease);white-space:nowrap}
  .btn-primary{background:linear-gradient(180deg,var(--accent-deep),#c33b29);color:#fff;box-shadow:0 1px 2px rgba(207,64,48,.22), 0 5px 16px -5px rgba(207,64,48,.30)}
  .btn-primary:hover{background:linear-gradient(180deg,#c33b29,#b0331e);transform:translateY(-1px);box-shadow:0 2px 5px rgba(207,64,48,.24), 0 10px 26px -6px rgba(207,64,48,.34)}
  .btn-dark{background:var(--black);color:#fff;box-shadow:0 1px 2px rgba(20,18,15,.2)}
  .btn-dark:hover{background:var(--accent);transform:translateY(-1px);box-shadow:0 6px 18px rgba(231,98,79,.26)}
  .btn-search{background:var(--accent);color:#fff;font-weight:600;box-shadow:0 1px 2px rgba(207,64,48,.16), 0 6px 16px -8px rgba(231,98,79,.36)}
  .btn-search:hover{background:var(--accent-deep);transform:translateY(-1px);box-shadow:0 2px 4px rgba(207,64,48,.18), 0 10px 22px -8px rgba(231,98,79,.42)}
  .btn-ghost{background:var(--paper);color:var(--ink-soft);border:1px solid var(--line)}
  .btn-ghost:hover{border-color:var(--ink-mute);color:var(--ink);background:var(--bg-warm)}
  .btn svg{width:17px;height:17px}

  /* ---------- Generic ---------- */
  .eyebrow{font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
  .pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;
        padding:5px 12px;border-radius:999px;letter-spacing:.01em;white-space:nowrap}
  .pill svg{width:14px;height:14px;flex:none}
  .pill-feat{background:var(--accent-soft);color:var(--accent-deep)}
  .pill-spec{background:var(--bg-warm);color:var(--ink-soft);border:1px solid var(--line)}
  .stars{color:var(--accent);font-weight:800;display:inline-flex;align-items:center;gap:5px}
  .stars svg{width:16px;height:16px;fill:var(--accent)}
  .muted{color:var(--ink-mute)}

  /* ---------- HOME: Hero (centrado · estilo Superprof) ---------- */
  .hero{position:relative;padding:24px 0 24px;background:transparent}
  .hero-box{position:relative;overflow:hidden;border-radius:36px;padding:44px 48px;
       display:flex;flex-direction:column;justify-content:center}
  @media(max-width:960px){ .hero-box{padding:40px 26px;border-radius:30px} }
  @media(max-width:640px){ .hero-box{padding:72px 18px 32px;border-radius:24px} }

  /* contenido centrado */
  .hero-inner{max-width:800px;margin:0 auto;text-align:center;position:relative;z-index:2}
  .hero-title{font-family:var(--serif);font-weight:600;color:var(--ink);
       font-size:clamp(28px,4.1vw,45px);line-height:1.16;letter-spacing:-.03em;margin:0}
  /* "abogado" y "Canarias" en el coral del logo, mismo tamaño y peso que el resto */
  .hero-title .accent{display:inline;margin:0;color:#e7624f;
       font-size:1em;font-weight:600;letter-spacing:inherit}
  /* Claim: "tu abogado" en coral con subrayado a mano; "en Canarias" en oscuro */
  .hero-title .ln1{white-space:nowrap}
  .hero-title .tail{white-space:nowrap;color:var(--ink)}
  .hero-title .uline{position:relative;display:inline-block;color:#e7624f;white-space:nowrap}
  .hero-title .uline::after{content:"";position:absolute;left:4%;right:8%;bottom:-.2em;height:.32em;
       background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 18' preserveAspectRatio='none'%3E%3Cpath d='M4 12 C 78 4 208 3 296 10' fill='none' stroke='%23e7624f' stroke-width='4.5' stroke-linecap='round'/%3E%3C/svg%3E");pointer-events:none}
  .hero .sub{font-size:clamp(16px,1.5vw,18.5px);color:var(--ink-soft);font-weight:400;line-height:1.55;
       margin:18px auto 0;max-width:44ch}

  /* compatibilidad con variantes antiguas del titular */
  .hero h1 .accent{color:#e7624f}

  /* Tarjeta de confianza (arriba a la derecha) */
  .trust-card{position:relative;background:var(--paper);border:1px solid var(--line-soft);
       border-radius:22px;box-shadow:var(--shadow-lg);padding:26px 28px 24px;overflow:hidden}
  .trust-card::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;
       background:linear-gradient(90deg,var(--accent),var(--accent-deep))}
  .tc-eyebrow{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:800;
       letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:18px}
  .tc-eyebrow .pulse{width:8px;height:8px;border-radius:50%;background:#3a9d6e;
       box-shadow:0 0 0 4px rgba(58,157,110,.16)}
  .tc-adv{list-style:none;display:flex;flex-direction:column;gap:14px;margin:0;padding:0}
  .tc-adv li{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--ink-soft);font-weight:500}
  .tc-adv .tick{flex:none;width:22px;height:22px;border-radius:50%;background:var(--accent-tint);
       border:1px solid var(--accent-soft);display:flex;align-items:center;justify-content:center}
  .tc-adv .tick svg{width:12px;height:12px;color:var(--accent-deep)}
  .tc-cap{margin-top:20px;font-size:13px;line-height:1.5;color:var(--ink-mute)}

  /* ---------- HOME hero · carrusel "Abogados recomendados" ---------- */
  .hc-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:22px}
  .hc-trust .hc-ti{display:inline-flex;align-items:center;gap:8px;
       background:rgba(255,255,255,.62);border:1px solid var(--line-soft);border-radius:999px;
       padding:9px 18px;font-size:12.5px;font-weight:600;color:var(--ink-soft);
       backdrop-filter:saturate(1.1)}
  .hc-trust .hc-ti svg{width:13px;height:13px;color:var(--accent);opacity:1;flex:none}
  .hc-col{display:flex;flex-direction:column;align-items:center;margin-top:4px}
  .hc-eyebrow{font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#a79d8f;margin-bottom:12px}
  .hc-deck{position:relative;width:392px;max-width:100%}
  .hc-slide{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .5s ease, transform .5s ease;z-index:1}
  .hc-slide.on{opacity:1;transform:none;pointer-events:auto;z-index:2}
  .hc-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:17px;box-shadow:var(--shadow-lg);cursor:pointer;padding:20px 22px;transition:transform .28s ease, box-shadow .28s ease}
  .hc-slide.on .hc-card:hover{transform:translateY(-3px)}
  .hc-top{display:flex;align-items:center;gap:14px}
  .hc-ph{width:60px;height:60px;flex:none;border-radius:50%;overflow:hidden;background:var(--bg-warm);box-shadow:0 1px 4px rgba(40,30,15,.14), 0 0 0 1px var(--line-soft)}
  .hc-ph img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
  .hc-who{flex:1;min-width:0}
  .hc-name{display:flex;align-items:center;gap:5px;font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:-.015em;color:var(--ink);line-height:1.18}
  .hc-meta{margin-top:4px;font-size:13.5px;font-weight:600;color:var(--ink-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hc-exp{margin-top:6px;font-size:12.5px;font-weight:600;color:var(--ink-mute)}
  .hc-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px}
  .hc-arrow{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);background:var(--paper);border:1px solid var(--line);border-radius:50%;box-shadow:0 1px 2px rgba(40,30,15,.06),0 2px 6px rgba(40,30,15,.05);transition:color .18s,border-color .18s,transform .18s}
  .hc-arrow svg{width:18px;height:18px}
  .hc-arrow:hover{color:var(--accent);border-color:var(--accent-soft);transform:scale(1.06)}
  .hc-dots{display:flex;gap:10px;align-items:center}
  .hc-dot{width:9px;height:9px;border-radius:50%;background:#c7b8a4;padding:0;border:none;cursor:pointer;transition:background .25s, transform .25s}
  .hc-dot.on{background:var(--accent);transform:scale(1.25)}
  .hc-seeall{margin-top:7px}
  .hc-seeall a{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--ink-soft);cursor:pointer;transition:color .18s}
  .hc-seeall a svg{width:14px;height:14px}
  .hc-seeall a:hover{color:var(--accent)}
  @media(max-width:960px){ .hc-col{margin-top:0} }
  @media(max-width:640px){ .hc-trust{display:none} .hc-col{display:none} }


  /* Buscador: herramienta principal, cápsula premium centrada (estilo Superprof) */
  .search-card{background:var(--paper);border-radius:26px;
       box-shadow:0 1px 2px rgba(40,30,15,.03), 0 10px 30px -20px rgba(40,30,15,.10);
       padding:16px 18px;margin:46px auto 0;max-width:760px;width:100%;position:relative;z-index:5;
       border:1px solid var(--line-soft)}
  .search-card h3{font-family:var(--serif);font-size:18px;font-weight:600;margin-bottom:14px}
  .search-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap}
  .search-row .field{flex:1;min-width:0}
  .field label{display:none}
  .select-wrap{position:relative}
  .select-wrap .ico{position:absolute;left:18px;top:50%;transform:translateY(-50%);
       width:19px;height:19px;color:var(--accent);pointer-events:none;
       display:flex;align-items:center;justify-content:center}
  .select-wrap .ico svg{width:19px;height:19px}
  .select-wrap .chev{position:absolute;right:16px;top:50%;transform:translateY(-50%);
       width:12px;height:12px;color:var(--ink-mute);pointer-events:none;
       display:flex;align-items:center;justify-content:center}
  .select-wrap .chev svg{width:12px;height:12px}
  .select-wrap.no-ico select{padding-left:16px}
  select,.fake-select{width:100%;height:54px;appearance:none;-webkit-appearance:none;
       font-family:inherit;font-size:15px;font-weight:500;color:var(--ink);
       background:var(--paper);border:1.4px solid var(--line);border-radius:14px;
       padding:0 40px 0 44px;cursor:pointer;transition:border-color .2s, box-shadow .2s}
  select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-tint)}
  select option{color:var(--ink)}
  /* Selects dentro de la cápsula: sin borde, fondo transparente, altura generosa */
  .search-card select{height:64px;border:none;border-radius:16px;background:transparent;
       font-weight:600;font-size:16px;padding:0 40px 0 52px}
  .search-card select:hover{background:var(--bg-warm)}
  .search-card select:focus{outline:none;border:none;box-shadow:none;background:var(--bg-warm)}
  .search-div{width:1px;height:36px;background:var(--line);flex:none}
  .search-card .btn{padding:0 30px;height:56px;border-radius:999px;font-size:15.5px;flex:none}

  /* Chips de especialidades: cápsulas blancas con sombra muy suave */
  .hero-chips-head{max-width:760px;margin:24px auto 0;text-align:left;
       font-size:12px;font-weight:600;letter-spacing:.03em;color:var(--ink-mute)}
  .hero-chips-wrap{position:relative;max-width:760px;margin:24px auto 0}
  .hero-chips{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:16px;
       overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;
       scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 2px 4px}
  .hero-chips::-webkit-scrollbar{display:none}
  /* Flechas de navegación (estilo Superprof) */
  .hero-chips-nav{position:absolute;top:calc(50% + 1px);transform:translateY(-50%);z-index:4;
       width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
       background:var(--paper);border:1px solid var(--line);color:var(--ink-soft);
       box-shadow:0 2px 10px -2px rgba(40,30,15,.18);cursor:pointer;
       transition:opacity .2s, color .18s, border-color .18s, transform .18s}
  .hero-chips-nav svg{width:17px;height:17px}
  .hero-chips-nav:hover{color:var(--accent);border-color:var(--accent-soft)}
  .hero-chips-next{right:-8px}
  .hero-chips-prev{left:-8px;opacity:0;pointer-events:none}
  .hero-chips-wrap.scrolled .hero-chips-prev{opacity:1;pointer-events:auto}
  .hero-chips-wrap.at-end .hero-chips-next{opacity:0;pointer-events:none}
  /* Desvanecido lateral para indicar que hay más */
  .hero-chips{-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}
  .hero-chips-wrap.scrolled .hero-chips{-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
  .hero-chips-wrap.at-end .hero-chips{-webkit-mask-image:linear-gradient(to right,transparent,#000 8%);mask-image:linear-gradient(to right,transparent,#000 8%)}
  .hero-chips-lbl{font-size:13px;font-weight:600;color:var(--ink-mute);margin-right:4px}
  .hero-chip{flex:0 0 auto;scroll-snap-align:start;text-align:center;font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--ink-soft);
       background:var(--paper);border:1px solid var(--line-soft);border-radius:999px;padding:10px 22px;cursor:pointer;
       box-shadow:0 1px 2px rgba(40,30,15,.04);
       transition:border-color .18s, color .18s, box-shadow .18s, transform .18s;line-height:1}
  .hero-chip:hover{border-color:var(--accent-soft);color:var(--accent-deep);transform:translateY(-1px);
       box-shadow:0 2px 8px -2px rgba(40,30,15,.10)}

  /* ---------- Practice areas strip ---------- */
  .section{padding:78px 0}
  .center{text-align:center}
  /* Quick specialties: hidden on desktop, shown as a swipe strip on mobile */
  .areas-band{display:contents}
  .areas-strip{display:none;flex-wrap:nowrap;gap:4px;width:100%;max-width:840px;
       margin:22px 0 0}
  .area-cell{flex:1 1 0;min-width:0;padding:12px 6px;text-align:center;cursor:pointer;
       position:relative;background:none;border:none;border-radius:14px;
       display:flex;flex-direction:column;align-items:center;gap:0;
       transition:background .2s ease}
  .area-cell:hover{background:var(--accent-tint)}
  .area-cell:hover .area-ic{color:var(--accent);transform:translateY(-2px)}
  .area-cell:hover .lbl{color:var(--ink)}
  .area-ic{width:38px;height:38px;display:flex;align-items:center;justify-content:center;
       margin:0 auto 9px;color:var(--ink-soft);background:none;border:none;
       transition:color .2s ease, transform .2s ease;stroke-width:1.5}
  .area-ic svg{width:26px;height:26px}
  .area-cell .lbl{font-size:11.5px;font-weight:600;line-height:1.28;color:var(--ink-soft);
       transition:color .2s ease}

  /* Fila de especialidades dentro del buscador — SOLO móvil */
  .hero-areas-m{display:none}
  @media(max-width:640px){
    .hero-areas-m{display:flex;gap:14px;width:100%;margin-top:14px;padding-top:14px;
         border-top:1px solid var(--line-soft);
         overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
         -ms-overflow-style:none;scrollbar-width:none;
         -webkit-mask-image:none;
         mask-image:none}
    .hero-areas-m::-webkit-scrollbar{display:none}
    .hero-areas-m .area-cell{flex:0 0 auto;width:auto;min-width:0;padding:6px 2px;scroll-snap-align:start}
    .hero-areas-m .area-ic{margin-bottom:7px}
    /* iconos premium: cada categoría en una pastilla con el color de marca */
    .hero-areas-m .area-ic{width:34px;height:34px;border-radius:0;margin:0 auto 6px;
         background:none;border:none;color:var(--accent);box-shadow:none;stroke-width:1.6}
    .hero-areas-m .area-ic svg{width:25px;height:25px}
    .hero-areas-m .area-cell .lbl{color:var(--ink-soft);font-weight:600;white-space:nowrap}
    .hero-areas-m .area-cell:active .area-ic{transform:scale(.93)}
    /* En móvil mostramos los iconos en lugar de las píldoras de texto */
    .hero-chips-wrap{display:none}
  }

  /* ---------- Featured lawyers (home) ---------- */
  /* La sección va sin encabezado, así que abre directamente con las fichas y
     el acceso al listado es el botón centrado de debajo. */
  .section-featured{padding-top:34px}
  /* Bloque de confianza de la home */
  .home-why{padding-top:46px;padding-bottom:6px}
  .home-why-title{font-family:var(--serif);font-size:clamp(23px,2.8vw,30px);font-weight:700;
       letter-spacing:-.02em;text-align:center;margin-bottom:26px}
  .home-why-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:13px}
  .why-item{display:flex;align-items:center;gap:11px;background:var(--paper);
       border:1px solid var(--line-soft);border-radius:14px;padding:13px 18px 13px 14px;
       font-size:14.5px;font-weight:600;color:var(--ink-soft);box-shadow:var(--shadow-sm);
       transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
  .why-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--accent-soft)}
  .why-item .wic{width:28px;height:28px;border-radius:50%;background:var(--accent-soft);
       color:var(--accent-deep);display:grid;place-items:center;flex:none}
  .why-item .wic svg{width:15px;height:15px;stroke-width:2.4}
  .featured-more{display:flex;justify-content:center;margin-top:24px}
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .head-row{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:30px;gap:20px}
  .head-row h2{font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.12}
  .link-more{font-size:14.5px;font-weight:700;color:var(--accent);display:inline-flex;align-items:center;gap:7px;
       transition:gap .2s}
  .link-more:hover{gap:11px}

  .card-feat{background:var(--paper);border-radius:var(--r);overflow:hidden;border:1px solid var(--line-soft);
       box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .32s var(--ease), box-shadow .32s var(--ease), border-color .32s var(--ease)}
  .card-feat:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--line)}
  .card-feat .ph{height:240px;overflow:hidden;background:var(--bg-warm);position:relative}
  .verif-badge{position:absolute;top:11px;right:11px;display:inline-flex;align-items:center;gap:5px;
               background:rgba(255,255,255,.88);backdrop-filter:blur(6px);color:var(--ink-soft);
               font-size:11px;font-weight:700;letter-spacing:.01em;padding:6px 10px;border-radius:999px;
               box-shadow:0 2px 8px rgba(40,30,15,.12);z-index:2}
  .verif-badge svg{width:13px;height:13px;color:var(--accent);flex:none}
  .card-feat .ph img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform .6s}
  .card-feat:hover .ph img{transform:scale(1.05)}
  .card-feat .bd{padding:26px 28px 28px}
  /* specialty pill (premium, subtle brand tint) — sits above the name */
  .card-feat .role{display:inline-flex;align-items:center;font-size:11.5px;letter-spacing:.04em;
       text-transform:uppercase;color:var(--accent-deep);font-weight:700;
       background:var(--accent-tint);border:1px solid var(--accent-soft);
       padding:5px 11px;border-radius:999px;margin-bottom:14px}
  /* name gets more visual weight */
  .card-feat h3{font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.2;
       letter-spacing:-.01em;margin-bottom:10px}
  .card-feat .loc{font-size:13.5px;color:var(--ink-mute);display:flex;align-items:center;gap:6px;margin-bottom:7px}
  .card-feat .firm-line{font-size:13px;color:var(--ink-soft);font-weight:600;margin-bottom:18px}
  .card-feat .loc svg{width:14px;height:14px;flex:none}
  .card-feat:hover .lcard-cta{background:var(--accent);box-shadow:0 5px 16px rgba(231,98,79,.26)}
  .card-feat:hover .lcard-cta svg{transform:translateX(3px)}

  /* ---------- CTA pro band ---------- */
  .cta-band{background:var(--bg-warm);border:1px solid var(--line);border-radius:20px;
       padding:38px 44px;display:flex;align-items:center;gap:30px;flex-wrap:wrap}
  .cta-band .ic{width:62px;height:62px;border-radius:50%;background:var(--accent-soft);
       display:grid;place-items:center;flex:none;color:var(--accent)}
  .cta-band .ic svg{width:30px;height:30px}
  .cta-band .txt{flex:1;min-width:240px}
  .cta-band h3{font-family:var(--serif);font-size:23px;font-weight:600;margin-bottom:6px}
  .cta-band p{font-size:15px;color:var(--ink-soft)}
  .cta-band .acts{display:flex;align-items:center;gap:22px;flex-wrap:wrap}

  /* ========== ABOUT / SOBRE NOSOTROS ========== */
  .ab-eyebrow{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.16em;
       text-transform:uppercase;color:var(--accent);margin-bottom:22px}
  .ab-eyebrow.center{text-align:center;margin-bottom:14px}
  /* Hero */
  .ab-hero{display:grid;grid-template-columns:1fr 1.15fr;gap:32px;align-items:center;padding:64px 0 76px}
  .about .ab-hero.wrap{max-width:1060px}
  .ab-hero-tx{max-width:480px}
  .ab-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(33px,3.7vw,46px);
       line-height:1.1;letter-spacing:-.03em;color:var(--ink)}
  .ab-rule{width:54px;height:2px;background:var(--accent);opacity:.5;border-radius:2px;margin:28px 0}
  .ab-hero-tx p{font-size:15.5px;line-height:1.7;color:var(--ink-mute);margin-bottom:18px;max-width:42ch}
  .ab-hero-tx p:last-child{margin-bottom:0}
  .ab-hero-tx strong{font-weight:700;color:var(--ink)}
  .ab-hero-img{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:3/2;background:var(--bg-warm)}
  .ab-hero-img img{width:100%;height:100%;object-fit:cover}
  /* Qué ofrecemos */
  .ab-offer{background:var(--bg-warm);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);
       padding:60px 0}
  .ab-head{text-align:center;margin-bottom:44px}
  .ab-head h2{font-family:var(--serif);font-weight:700;font-size:clamp(27px,3vw,36px);
       letter-spacing:-.025em;color:var(--ink)}
  .ab-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:1000px;margin:0 auto}
  .ab-feature{text-align:center;padding:8px 30px;position:relative}
  .ab-feature + .ab-feature::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:1px;background:var(--line-soft)}
  .ab-ic{width:60px;height:60px;margin:0 auto 20px;color:var(--accent);stroke-width:1.6;
       display:grid;place-items:center;background:var(--accent-tint);border-radius:16px;border:1px solid var(--accent-soft)}
  .ab-ic svg{width:30px;height:30px}
  .ab-feature h3{font-family:var(--serif);font-size:17.5px;font-weight:700;line-height:1.3;margin-bottom:12px;letter-spacing:-.01em}
  .ab-feature p{font-size:14px;line-height:1.6;color:var(--ink-mute)}
  /* Canarias */
  .ab-local{display:grid;grid-template-columns:.92fr 1.25fr;gap:34px;align-items:center;padding:76px 0}
  .about .ab-local.wrap{max-width:1060px}
  .ab-local-tx{max-width:440px}
  .ab-local-tx h2{font-family:var(--serif);font-weight:700;font-size:clamp(27px,3vw,36px);
       line-height:1.13;letter-spacing:-.025em;color:var(--ink);margin-bottom:22px}
  .ab-local-tx p{font-size:15.5px;line-height:1.7;color:var(--ink-mute)}
  .ab-local-img{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:16/10;background:var(--bg-warm)}
  .ab-local-img img{width:100%;height:100%;object-fit:cover}
  /* CTA */
  .ab-cta{background:var(--bg-warm);border:1px solid var(--line);
       border-radius:22px;padding:54px 40px;text-align:center;margin:16px 0 26px}
  .ab-cta .ic{width:62px;height:62px;border-radius:50%;background:var(--accent-soft);
       display:grid;place-items:center;color:var(--accent);margin:0 auto 22px}
  .ab-cta .ic svg{width:30px;height:30px;stroke-width:1.7}
  .ab-cta h2{font-family:var(--serif);font-weight:700;font-size:clamp(28px,3.2vw,38px);
       letter-spacing:-.025em;color:var(--ink);margin-bottom:12px}
  .ab-cta p{font-size:16px;color:var(--ink-soft);margin-bottom:26px;max-width:46ch;margin-left:auto;margin-right:auto}
  .btn-light{background:var(--accent);color:#fff;font-weight:700;height:54px;padding:0 34px;border-radius:12px;
       box-shadow:0 2px 10px rgba(231,98,79,.22)}
  .btn-light:hover{background:var(--accent-deep);transform:translateY(-1px);box-shadow:0 8px 22px rgba(231,98,79,.34)}
  .btn-light svg{width:15px;height:15px;transition:transform .2s}
  .btn-light:hover svg{transform:translateX(3px)}

  /* ---------- FAQ / PREGUNTAS FRECUENTES ---------- */
  .faqp{padding-bottom:40px}
  .faqp-hero{text-align:center;max-width:760px;margin:0 auto;padding:54px 0 30px}
  .faqp-hero .eyebrow{display:inline-flex;align-items:center;gap:7px;margin-bottom:16px}
  .faqp-hero .eyebrow svg{width:14px;height:14px;stroke-width:2}
  .faqp-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(31px,3.6vw,44px);
       line-height:1.1;letter-spacing:-.025em;color:var(--ink);margin-bottom:18px}
  .faqp-hero p{font-size:16.5px;line-height:1.65;color:var(--ink-mute);max-width:54ch;margin:0 auto}
  /* Filtro/índice de categorías */
  .faqp-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:30px auto 44px;max-width:780px}
  .faqp-tab{height:40px;padding:0 18px;border-radius:999px;border:1px solid var(--line);
       background:var(--paper);color:var(--ink-soft);font-size:14px;font-weight:600;
       display:inline-flex;align-items:center;gap:8px;transition:all .18s}
  .faqp-tab svg{width:15px;height:15px;stroke-width:1.9;color:var(--accent)}
  .faqp-tab:hover{border-color:var(--accent-soft);background:var(--accent-tint);transform:translateY(-1px)}
  .faqp-tab.on{background:var(--accent);border-color:var(--accent);color:#fff}
  .faqp-tab.on svg{color:#fff}
  /* Secciones de preguntas */
  .faqp-sec{max-width:820px;margin:0 auto 16px}
  .faqp-sec-head{display:flex;align-items:center;gap:13px;padding:30px 4px 14px}
  .faqp-sec-ic{width:40px;height:40px;flex:none;border-radius:11px;display:grid;place-items:center;
       background:var(--accent-tint);border:1px solid var(--accent-soft);color:var(--accent)}
  .faqp-sec-ic svg{width:20px;height:20px;stroke-width:1.7}
  .faqp-sec-head h2{font-family:var(--serif);font-weight:700;font-size:21px;letter-spacing:-.015em;color:var(--ink)}
  /* Acordeón */
  .faq-item{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);
       margin-bottom:12px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
  .faq-item.open{border-color:var(--accent-soft);box-shadow:var(--shadow-sm)}
  .faq-q{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:16px;
       padding:19px 22px;font-family:var(--serif);font-size:16.5px;font-weight:600;letter-spacing:-.01em;
       color:var(--ink);line-height:1.4}
  .faq-q:hover{color:var(--accent-deep)}
  .faq-qic{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
       background:var(--accent-tint);color:var(--accent);transition:transform .25s,background .2s}
  .faq-qic svg{width:14px;height:14px;stroke-width:2.4}
  .faq-item.open .faq-qic{transform:rotate(45deg);background:var(--accent);color:#fff}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
  .faq-a-inner{padding:0 22px 20px;font-size:15px;line-height:1.7;color:var(--ink-soft)}
  .faq-a-inner p{margin-bottom:11px}
  .faq-a-inner p:last-child{margin-bottom:0}
  .faq-a-inner a{color:var(--accent);font-weight:600;border-bottom:1px solid var(--accent-soft)}
  .faq-a-inner a:hover{border-bottom-color:var(--accent)}
  .faq-a-inner strong{color:var(--ink);font-weight:700}
  /* CTA final */
  .faqp-cta{max-width:820px;margin:46px auto 0}
  @media(max-width:640px){
    .faqp-hero{padding:38px 0 22px}
    .faqp-nav{gap:8px;margin:24px auto 32px}
    .faqp-tab{height:36px;padding:0 14px;font-size:13px}
    .faq-q{padding:16px 16px;font-size:15.5px}
    .faq-a-inner{padding:0 16px 16px}
    .faqp-sec-head{padding:22px 2px 10px}
  }

  /* ---------- NEWS / ACTUALIDAD ---------- */
  /* Artículo individual */
  .article{max-width:760px;margin:0 auto;padding-top:24px}
  .article .crumbs{font-size:13.5px;color:var(--ink-soft);margin-bottom:22px}
  .article .crumbs a{color:var(--accent);cursor:pointer;text-decoration:none}
  .article .crumbs a:hover{text-decoration:underline}
  .article-cat{display:inline-block;background:var(--accent-soft);color:var(--accent-deep);
       font-weight:600;font-size:13px;padding:4px 12px;border-radius:999px;margin-bottom:14px}
  .article-body h1{font-family:var(--serif);font-size:clamp(26px,3.4vw,36px);line-height:1.2;
       letter-spacing:-.02em;color:var(--ink);margin:0 0 12px}
  .article-meta{color:var(--ink-soft);font-size:14px;margin-bottom:24px}
  .article-cover{border-radius:18px;overflow:hidden;margin-bottom:30px;aspect-ratio:16/8}
  .article-cover img{width:100%;height:100%;object-fit:cover;display:block}
  .article-content{font-size:17px;line-height:1.72;color:#2c2a26}
  .article-content h2{font-family:var(--serif);font-size:22px;line-height:1.3;color:var(--ink);
       margin:30px 0 10px;letter-spacing:-.01em}
  .article-content p{margin:0 0 16px}
  .article-content ul{margin:0 0 16px;padding-left:22px}
  .article-content li{margin:6px 0}
  .article-content strong{color:var(--ink)}
  .article-cta{margin:36px 0 22px;padding:28px;border-radius:20px;text-align:center;
       background:var(--accent-soft);border:1px solid rgba(231,98,79,.16)}
  .article-cta .ic{width:46px;height:46px;border-radius:12px;background:#fff;display:flex;
       align-items:center;justify-content:center;margin:0 auto 12px;color:var(--accent)}
  .article-cta h2{font-family:var(--serif);font-size:21px;color:var(--ink);margin:0 0 6px}
  .article-cta p{color:var(--ink-soft);margin:0 0 16px;font-size:15px}
  .article-back{display:inline-flex;align-items:center;gap:8px;color:var(--accent);
       cursor:pointer;font-weight:600;font-size:14.5px;margin-top:6px;white-space:nowrap}
  .article-back svg{width:18px;height:18px;flex:none}
  .article-back:hover{text-decoration:underline}
  @media(max-width:640px){ .article-content{font-size:16px} .article-cover{aspect-ratio:16/10} }

  .news-hero{display:grid;grid-template-columns:1fr 1.15fr;gap:38px;align-items:start;padding:60px 0 56px}
  .news-hero-compact{max-width:1080px;padding:34px 0 20px}
  .news-hero-compact h1{font-family:var(--serif);font-weight:700;font-size:clamp(26px,3vw,34px);
       line-height:1.18;letter-spacing:-.02em;color:var(--ink);margin:8px 0 8px}
  .news-hero-compact p{font-size:16px;line-height:1.55;color:var(--ink-soft);margin:0;max-width:56ch}
  .news .news-hero.wrap{max-width:1080px}
  .news-hero-tx{max-width:480px;padding-top:8px}
  .news-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(33px,3.9vw,48px);
       line-height:1.08;letter-spacing:-.03em;color:var(--ink)}
  .news-hero-tx p{font-size:16.5px;line-height:1.6;color:var(--ink-mute);max-width:40ch}
  .news-hero-img{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:3/2;background:var(--bg-warm)}
  .news-hero-img img{width:100%;height:100%;object-fit:cover}

  .news-main{max-width:1080px;padding-bottom:20px}
  /* Filters bar */
  .news-filters{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
  .news-search{flex:1;min-width:240px;display:flex;align-items:center;gap:11px;
       background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:0 16px;height:52px;
       transition:border-color .2s, box-shadow .2s}
  .news-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
  .news-search svg{width:19px;height:19px;color:var(--ink-mute);flex:none;stroke-width:1.8}
  .news-search input{flex:1;border:none;background:none;outline:none;font-family:var(--sans);
       font-size:15px;color:var(--ink)}
  .news-search input::placeholder{color:var(--ink-mute)}
  /* Category chips */
  .news-chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:42px}
  .news-chip{font-family:var(--sans);font-size:13.5px;font-weight:700;color:var(--ink-soft);
       background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:9px 18px;
       cursor:pointer;transition:all .2s;letter-spacing:-.005em}
  .news-chip:hover{border-color:var(--ink-mute);color:var(--ink)}
  .news-chip.active{background:var(--accent);border-color:var(--accent);color:#fff;
       box-shadow:0 2px 8px rgba(231,98,79,.22)}
  /* Section head */
  .news-head-row{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:24px}
  .news-head-row h2{font-family:var(--serif);font-size:clamp(24px,2.6vw,30px);font-weight:700;letter-spacing:-.02em}
  /* Article grid */
  .news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
  .news-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden;
       cursor:pointer;display:flex;flex-direction:column;
       box-shadow:var(--shadow-sm);transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease}
  .news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--line)}
  .news-card-img{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-warm)}
  .news-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .news-card:hover .news-card-img img{transform:scale(1.04)}
  .news-tag{position:absolute;top:14px;left:14px;background:var(--accent);color:#fff;
       font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
       padding:6px 12px;border-radius:8px;box-shadow:0 2px 8px rgba(231,98,79,.28)}
  .news-card-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
  .news-meta{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;
       color:var(--ink-mute);letter-spacing:.01em;text-transform:uppercase;margin-bottom:13px}
  .news-dot{width:3px;height:3px;border-radius:50%;background:var(--ink-mute);opacity:.5}
  .news-card h3{font-family:var(--serif);font-size:21px;font-weight:600;line-height:1.22;
       letter-spacing:-.015em;color:var(--ink);margin-bottom:11px}
  .news-card p{font-size:14.5px;line-height:1.6;color:var(--ink-mute);flex:1;margin-bottom:20px}
  .news-read{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;
       color:var(--accent);letter-spacing:-.005em;transition:gap .2s}
  .news-read svg{width:15px;height:15px;transition:transform .2s}
  .news-card:hover .news-read{gap:11px}

  /* ---------- REGISTER / PARA ABOGADOS ---------- */
  .reg{padding:30px 0 0}
  .reg-card{max-width:1100px;margin:0 auto;background:var(--paper);border:1px solid var(--line);
       border-radius:24px;box-shadow:var(--shadow-lg);overflow:hidden;
       display:grid;grid-template-columns:268px 1fr}
  /* Sidebar (más ligero, sin robar protagonismo al formulario) */
  .reg-side{background:var(--bg-warm);border-right:1px solid var(--line);display:flex;flex-direction:column}
  .reg-side-top{padding:38px 30px 34px}
  .reg-value{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.25;letter-spacing:-.02em;color:var(--ink)}
  .reg-value span{color:var(--accent)}
  .reg-value-sub{font-size:13.5px;line-height:1.6;color:var(--ink-mute);margin:14px 0 30px;max-width:30ch}
  .reg-benefits{display:flex;flex-direction:column;gap:20px}
  .reg-benefit{display:grid;grid-template-columns:30px 1fr;gap:0 12px;align-items:start}
  .reg-b-ic{width:30px;height:30px;border-radius:9px;background:transparent;border:none;
       color:var(--accent);display:grid;place-items:center}
  .reg-b-ic svg{width:19px;height:19px;stroke-width:1.7}
  .reg-b-tx h4{font-family:var(--sans);font-size:13.5px;font-weight:700;color:var(--ink-soft);margin-bottom:3px;letter-spacing:-.005em}
  .reg-b-tx p{font-size:12px;line-height:1.5;color:var(--ink-mute)}
  /* Form (más aire) */
  .reg-main{padding:44px 48px 40px}
  .reg-head{margin-bottom:30px}
  .reg-head h1{font-family:var(--serif);font-weight:700;font-size:27px;letter-spacing:-.025em;color:var(--ink)}
  .reg-head p{font-size:14px;color:var(--ink-mute);margin-top:6px}
  .reg-sec{padding-bottom:32px;margin-bottom:32px;border-bottom:1px solid var(--line-soft)}
  .reg-sec-last{border-bottom:none;margin-bottom:18px;padding-bottom:6px}
  .reg-sec-title{display:flex;align-items:center;gap:9px;margin-bottom:22px;color:var(--accent)}
  .reg-sec-title svg{width:19px;height:19px;stroke-width:1.7}
  .reg-sec-title h3{font-family:var(--serif);font-size:16.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
  .reg-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px 22px}
  .reg-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px 22px}
  .reg-sec .reg-grid-2,.reg-sec .reg-grid-3{margin-bottom:20px}
  .reg-sec .reg-grid-2:last-child,.reg-sec .reg-grid-3:last-child,.reg-sec .reg-field:last-child{margin-bottom:0}
  .reg-field{display:flex;flex-direction:column;margin-bottom:20px}
  .reg-lbl{font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:8px;letter-spacing:.005em}
  .reg-lbl i{color:var(--accent);font-style:normal}
  .reg-opt{font-weight:500;color:var(--ink-mute);font-style:normal;font-size:12px}
  /* Inputs */
  .reg-field input,.reg-field textarea,.reg-select select{
       width:100%;font-family:var(--sans);font-size:14px;color:var(--ink);background:var(--paper);
       border:1px solid var(--line);border-radius:13px;padding:0 15px;height:50px;
       transition:border-color .18s, box-shadow .18s;box-sizing:border-box}
  .reg-field input::placeholder,.reg-field textarea::placeholder{color:var(--ink-mute)}
  .reg-field input:focus,.reg-field textarea:focus,.reg-select select:focus{
       outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
  /* Personal: fields + photo */
  .reg-personal{display:grid;grid-template-columns:1fr 158px;gap:30px;align-items:start}
  .reg-fields{display:flex;flex-direction:column;gap:20px}
  .reg-fields .reg-grid-2{margin-bottom:0}
  /* Chips multiselect */
  .reg-chips{display:flex;flex-wrap:wrap;gap:8px}
  .reg-chip{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--ink-soft);
       background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:8px 15px;cursor:pointer;
       transition:all .16s;line-height:1}
  .reg-chip:hover{border-color:var(--accent);color:var(--accent-deep)}
  .reg-chip.on{background:var(--accent-tint);border-color:var(--accent);color:var(--accent-deep)}
  .reg-chip.is-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}
  /* Toggle full-width row */
  .reg-toggle-row{width:100%;height:auto;padding:13px 15px;margin-top:16px;border:1px solid var(--line);
       border-radius:11px;background:var(--paper);transition:border-color .16s,background .16s}
  .reg-toggle-row:hover{border-color:var(--ink-mute)}
  .reg-toggle-row.on{border-color:var(--accent);background:var(--accent-tint)}
  .reg-photo{display:flex;flex-direction:column;align-items:center}
  .reg-photo-tip{display:flex;gap:9px;align-items:flex-start;margin:18px 0 0;
       background:var(--accent-soft);border:1px solid rgba(231,98,79,.16);border-radius:12px;
       padding:12px 15px;font-size:13px;line-height:1.5;color:var(--ink-soft)}
  .reg-photo-tip svg{width:16px;height:16px;flex:none;margin-top:1px;color:var(--accent)}
  .reg-photo-tip strong{color:var(--ink)}
  .reg-cam-btn{margin-top:10px;background:none;border:1px solid var(--line);color:var(--ink-soft);
       border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;
       display:inline-flex;align-items:center;gap:7px;transition:border-color .2s var(--ease), color .2s var(--ease)}
  .reg-cam-btn svg{width:16px;height:16px}
  .reg-cam-btn:hover{border-color:var(--accent);color:var(--accent)}
  .regcam-modal{position:fixed;inset:0;z-index:9999;background:rgba(24,18,12,.72);
       display:flex;align-items:center;justify-content:center;padding:20px;
       -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
  .regcam-box{background:#fff;border-radius:20px;padding:16px;max-width:380px;width:100%;box-shadow:var(--shadow-lg)}
  .regcam-box video{width:100%;border-radius:14px;background:#000;aspect-ratio:1/1;object-fit:cover;display:block;transform:scaleX(-1)}
  .regcam-actions{display:flex;gap:10px;margin-top:14px}
  .regcam-actions .btn{flex:1;justify-content:center}
  .reg-lbl-center{width:100%;text-align:center}
  .reg-avatar{width:104px;height:104px;border-radius:50%;border:1.5px dashed var(--line);background:var(--bg-warm);
       display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--ink-mute);
       cursor:pointer;transition:all .2s;margin-top:8px}
  .reg-avatar:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-tint)}
  .reg-avatar svg{width:24px;height:24px;stroke-width:1.6}
  .reg-avatar span{font-size:12px;font-weight:600}
  .reg-hint{font-size:11px;color:var(--ink-mute);margin-top:10px}
  /* Aviso de que la foto puede esperar: algo más legible que la línea de
     formatos, porque es lo que evita que alguien abandone el alta aquí. */
  .reg-hint-sin-prisa{font-size:12px;line-height:1.4;color:var(--ink-soft);margin-top:5px;font-weight:600}
  /* Select */
  .reg-select{position:relative}
  .reg-select select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:40px}
  .reg-select select:invalid{color:var(--ink-mute)}
  .reg-chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--ink-mute);
       display:grid;place-items:center}
  .reg-chev svg{width:15px;height:15px}
  /* Textarea */
  .reg-textwrap{position:relative}
  .reg-field textarea{height:auto;min-height:104px;padding:12px 14px;line-height:1.55;resize:vertical}
  .reg-count{position:absolute;right:12px;bottom:10px;font-size:11.5px;color:var(--ink-mute);pointer-events:none}
  /* Input with icon */
  .reg-input-ic{position:relative;display:flex;align-items:center}
  .reg-input-ic svg{position:absolute;left:13px;width:17px;height:17px;color:var(--ink-mute);stroke-width:1.7;pointer-events:none}
  .reg-input-ic input{padding-left:38px}
  .reg-input-ic-r svg{left:auto;right:13px}
  .reg-input-ic-r input{padding-left:14px;padding-right:38px}
  /* Segmented control */
  .reg-seg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
  .reg-seg-btn{display:flex;align-items:center;justify-content:center;gap:7px;height:46px;padding:0 6px;
       font-family:var(--sans);font-size:13px;font-weight:600;color:var(--ink-soft);
       background:var(--paper);border:1px solid var(--line);border-radius:11px;cursor:pointer;transition:all .18s}
  .reg-seg-btn svg{width:16px;height:16px;stroke-width:1.7;flex:none}
  .reg-seg-btn:hover{border-color:var(--ink-mute)}
  .reg-seg-btn.active{background:var(--accent-tint);border-color:var(--accent);color:var(--accent-deep)}
  /* Toggle */
  .reg-grid-align{align-items:start}
  .reg-toggle{display:flex;align-items:center;gap:11px;height:46px;background:none;border:none;cursor:pointer;padding:0;text-align:left}
  .reg-knob{width:42px;height:24px;border-radius:999px;background:var(--line);position:relative;transition:background .2s;flex:none}
  .reg-knob::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;
       box-shadow:0 1px 3px rgba(0,0,0,.18);transition:transform .2s}
  .reg-toggle.on .reg-knob{background:var(--accent)}
  .reg-toggle.on .reg-knob::after{transform:translateX(18px)}
  .reg-toggle-tx{font-size:13px;color:var(--ink-soft);font-style:normal;line-height:1.3}
  /* Note */
  .reg-note{display:flex;align-items:center;gap:10px;background:var(--accent-tint);border:1px solid var(--accent-soft);
       border-radius:11px;padding:13px 15px;margin-bottom:18px;font-size:13px;color:var(--accent-deep)}
  .reg-note svg{width:17px;height:17px;flex:none;stroke-width:1.8}
  /* Checks */
  .reg-check{display:flex;align-items:center;gap:11px;font-size:13.5px;color:var(--ink-soft);cursor:pointer;padding:7px 0}
  .reg-check i{color:var(--accent);font-style:normal}
  .reg-check a{color:var(--accent);font-weight:600;cursor:pointer}
  .reg-check a:hover{text-decoration:underline}
  .reg-box{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--line);background:var(--paper);flex:none;
       display:grid;place-items:center;color:#fff;transition:all .15s}
  .reg-box svg{width:13px;height:13px;stroke-width:2.4;opacity:0;transition:opacity .15s}
  .reg-check.on .reg-box{background:var(--accent);border-color:var(--accent)}
  .reg-check.on .reg-box svg{opacity:1}
  .reg-enhance{margin-top:8px;align-items:flex-start;font-size:12.5px;color:var(--ink-mute)}
  .reg-enhance .reg-box{margin-top:1px}
  .reg-enhance strong{color:var(--ink-soft);font-weight:600}
  /* Submit */
  .reg-submit{width:100%;height:56px;margin-top:24px;display:flex;align-items:center;justify-content:center;gap:10px;
       font-family:var(--sans);font-size:16px;font-weight:700;color:#fff;border:none;border-radius:13px;cursor:pointer;
       background:linear-gradient(180deg, var(--accent) 0%, var(--accent-deep) 100%);
       box-shadow:0 4px 16px rgba(231,98,79,.32);transition:transform .15s, box-shadow .15s;letter-spacing:.005em}
  .reg-submit svg{width:18px;height:18px;stroke-width:1.9}
  .reg-submit:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(231,98,79,.4)}
  .reg-submit:active{transform:translateY(0)}
  .reg-secure{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:14px;font-size:12.5px;color:var(--ink-mute)}
  .reg-secure svg{width:14px;height:14px;stroke-width:1.7}
  .reg-bottom-pad{height:50px}

  /* ===== Página de CONTACTO (minimalista) ===== */
  .ct{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:start;margin-top:8px;
       max-width:1000px}
  .ct-intro h1{font-family:var(--serif);font-size:34px;font-weight:600;letter-spacing:-.025em;line-height:1.08;margin:8px 0 14px}
  .ct-sub{font-size:15.5px;color:var(--ink-soft);line-height:1.6;max-width:42ch}
  .ct-reasons{margin-top:28px;display:flex;flex-direction:column;gap:18px}
  .ct-reason{display:flex;align-items:flex-start;gap:14px}
  .ct-reason-ic{width:42px;height:42px;border-radius:11px;background:var(--accent-tint);color:var(--accent);
       display:grid;place-items:center;flex:none}
  .ct-reason-ic svg{width:20px;height:20px;stroke-width:1.7}
  .ct-reason-tx{display:flex;flex-direction:column;gap:3px}
  .ct-reason-tx b{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  .ct-reason-tx span{font-size:13.5px;color:var(--ink-mute);line-height:1.5}
  .ct-direct{margin-top:28px;padding-top:22px;border-top:1px solid var(--line-soft);
       display:flex;flex-wrap:wrap;gap:10px 24px}
  .ct-direct-item{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink-soft)}
  .ct-direct-item svg{width:16px;height:16px;color:var(--accent);flex:none}
  .ct-form{background:var(--paper);border:1px solid var(--line);border-radius:18px;
       padding:30px 32px;box-shadow:var(--shadow-sm)}
  .ct-form .reg-field textarea{min-height:130px}
  /* Consulta de cliente: la descripción es breve (3 filas), no un mensaje largo.
     El hueco inferior reserva sitio para el contador y evita que pise al texto. */
  .cs-form .reg-field textarea{min-height:104px;padding-bottom:26px}
  .cs-form .reg-hint{margin-top:7px}
  .cs-disclaimer{margin-top:14px;font-size:12px;line-height:1.5;color:var(--ink-mute);text-align:center}

  /* ===== Botones adicionales ===== */
  .btn-outline{background:var(--paper);color:var(--ink);border:1px solid var(--line)}
  .btn-outline:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-tint)}
  .btn-ghost-line{background:transparent;color:var(--ink-mute);border:1px solid var(--line)}
  .btn-ghost-line:hover{color:var(--accent);border-color:var(--accent-soft)}

  /* ============================================================
     PARA ABOGADOS — HUB / PLANES
     ============================================================ */
  /* HERO centrado y enfocado: titular → CTAs → lanzamiento */
  .pro-hero{max-width:680px;margin:6px auto 0;padding:4px 0 0;text-align:center;
       display:flex;flex-direction:column;align-items:center}
  .pro-hero .eyebrow{margin-bottom:0;display:inline-flex;align-items:center;gap:7px;justify-content:center;
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:999px;padding:6px 14px;letter-spacing:.1em}
  .pro-hero .eyebrow svg{width:14px;height:14px;stroke-width:2}
  .pro-hero-link{color:var(--accent);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
  .pro-hero-link:hover{color:var(--accent-deep)}
  .pro-hero-note{font-size:13px;color:var(--ink-mute);margin-top:8px}
  .pro-hero-note .pro-hero-link{font-weight:600}
  .pro-hero h1{font-family:var(--serif);font-size:36px;font-weight:700;letter-spacing:-.03em;line-height:1.05;margin:12px 0 10px}
  .pro-hero h1 span{color:var(--accent)}
  .pro-hero-sub{font-size:15.5px;color:var(--ink-soft);line-height:1.55;max-width:520px;margin:0 auto}
  /* CTAs = lo primero que llama la atención */
  .pro-hero-cta{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap;justify-content:center}
  .pro-cta-main{height:52px;padding:0 30px;font-size:15.5px;box-shadow:0 6px 20px rgba(231,98,79,.28)}
  .pro-cta-main:hover{box-shadow:0 10px 28px rgba(231,98,79,.36)}
  .pro-cta-alt{height:52px;padding:0 28px;font-size:15.5px;
       background:var(--ink);color:#fff;border:1.5px solid var(--ink);box-shadow:0 1px 2px rgba(20,18,15,.2)}
  .pro-cta-alt svg{color:#fff}
  .pro-cta-alt:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-1px);box-shadow:0 6px 18px rgba(231,98,79,.26)}
  .pro-launch{display:flex;align-items:center;gap:12px;margin-top:24px;padding:14px 18px;
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:12px;
       font-size:14.5px;font-weight:600;color:var(--accent-deep);line-height:1.45}
  .pro-launch svg{width:22px;height:22px;color:var(--accent);flex:none}
  .pro-launch.sm{font-size:13.5px;padding:12px 15px;margin:18px 0}
  /* banda de lanzamiento destacada dentro del hero */
  .pro-launch-hero{max-width:520px;margin:16px auto 0;justify-content:center;text-align:left;padding:12px 16px;
       font-size:13.5px;background:linear-gradient(180deg, #fbf2ea, #f9ece0);border-color:#f0d8c4}
  .pro-launch-hero svg{width:20px;height:20px}
  .pro-launch-hero b{color:var(--accent-deep)}

  /* Ventajas (debajo del hero) — compactas */
  .pro-why{margin-top:30px;padding-top:28px;border-top:1px solid var(--line)}
  .pro-why-title{font-family:var(--serif);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
       color:var(--ink-mute);text-align:center;margin-bottom:22px}
  .pro-vps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:0}
  .pro-vp{display:flex;flex-direction:column;gap:7px}
  .pro-vp-ic{width:38px;height:38px;border-radius:10px;background:var(--accent-tint);color:var(--accent);display:grid;place-items:center}
  .pro-vp-ic svg{width:20px;height:20px;stroke-width:1.7}
  .pro-vp b{font-size:14.5px;font-weight:700;color:var(--ink);display:block;margin-bottom:2px;letter-spacing:-.01em}
  .pro-vp span{font-size:12.5px;color:var(--ink-mute);line-height:1.45}

  /* Planes: panel propio con fondo cálido para separarse del hero */
  .pro-plans-sec{margin-top:40px;padding:38px 36px 34px;background:var(--bg-warm);
       border:1px solid var(--line);border-radius:22px}
  .pro-plans-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;margin-bottom:28px}
  .pro-plans-head h2{font-size:30px;letter-spacing:-.02em}
  .pro-plans-intro{font-size:14.5px;color:var(--ink-mute);margin-bottom:8px}
  .pro-switch{display:inline-flex;background:var(--bg-warm);border:1px solid var(--line);border-radius:999px;padding:4px}
  .pro-switch-btn{padding:9px 26px;border-radius:999px;font-size:14.5px;font-weight:700;color:var(--ink-mute);transition:all .2s;cursor:pointer}
  .pro-switch-btn.on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-sm)}

  .plans{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;max-width:760px;margin:0 auto}
  .plan{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:22px;
       padding:34px 30px;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}
  .plan-feat{border-color:var(--accent);box-shadow:0 10px 34px rgba(231,98,79,.12)}
  .plan-tag{position:absolute;top:-11px;left:28px;background:var(--accent);color:#fff;font-size:11px;font-weight:800;
       letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
  .plan-head h3{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:-.01em}
  .plan-tagline{font-size:13.5px;color:var(--ink-mute);margin-top:4px;line-height:1.4}
  .plan-price{display:flex;align-items:baseline;gap:4px;margin:16px 0 4px;flex-wrap:wrap}
  .plan-price b{font-family:var(--serif);font-size:36px;font-weight:700;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
  .plan-price span{font-size:15px;color:var(--ink-mute);font-weight:600}
  .plan-price .plan-soon{font-size:23px;color:var(--ink-soft)}
  .plan-price .plan-freenote{display:block;width:100%;font-size:12.5px;font-weight:600;color:var(--ink-mute);margin-top:4px}
  .plan-bens{list-style:none;margin:18px 0 22px;display:flex;flex-direction:column;gap:11px}
  .plan-bens li{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--ink-soft);line-height:1.45}
  .plan-bens li svg{width:17px;height:17px;color:var(--accent);flex:none;margin-top:1px}
  .plan-cta{width:100%;height:50px;margin-top:auto}
  .pro-plans-note{font-size:13px;color:var(--ink-mute);margin-top:20px;text-align:center}

  /* ============================================================
     ACCESO (LOGIN)
     ============================================================ */
  .auth-wrap{display:flex;justify-content:center;padding:20px 0 10px}
  .auth-card{width:100%;max-width:430px;background:var(--paper);border:1px solid var(--line);
       border-radius:20px;padding:36px 34px;box-shadow:var(--shadow-md)}
  .auth-head{text-align:center;margin-bottom:24px}
  .auth-ic{width:52px;height:52px;border-radius:14px;background:var(--accent-tint);color:var(--accent);
       display:grid;place-items:center;margin:0 auto 14px}
  .auth-ic svg{width:25px;height:25px}
  .auth-head h1{font-family:var(--serif);font-size:24px;font-weight:600;letter-spacing:-.02em}
  .auth-head p{font-size:14px;color:var(--ink-mute);margin-top:6px;line-height:1.55}
  .auth-submit{width:100%;height:50px;margin-top:6px;font-size:15px}
  .auth-divider{display:flex;align-items:center;gap:14px;margin:22px 0 14px;
       font-size:13px;color:var(--ink-mute);font-weight:500}
  .auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line-soft)}
  .auth-alt{width:100%;height:48px;font-size:14.5px;gap:8px}
  .auth-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 18px;flex-wrap:wrap}
  .auth-check{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink-soft);cursor:pointer}
  .auth-check input{width:16px;height:16px;accent-color:var(--accent)}
  .auth-link{font-size:13.5px;color:var(--accent);font-weight:600;cursor:pointer}
  .auth-link:hover{color:var(--accent-deep)}
  .auth-modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .auth-modes .btn{height:50px}
  .auth-foot{text-align:center;font-size:14px;color:var(--ink-mute);margin-top:20px}
  .auth-foot a{color:var(--accent);font-weight:700;cursor:pointer}
  .auth-foot a:hover{color:var(--accent-deep)}

  /* ============================================================
     ÁREA PRIVADA (DASHBOARD)
     ============================================================ */
  .acct{display:grid;grid-template-columns:264px 1fr;gap:30px;align-items:start;margin-top:8px}
  .acct-side{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);position:sticky;top:96px}
  .acct-user{display:flex;align-items:center;gap:13px;padding-bottom:18px;margin-bottom:14px;border-bottom:1px solid var(--line-soft)}
  .acct-avatar{width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;
       font-weight:800;font-size:16px;flex:none;letter-spacing:.02em}
  .acct-user-tx{display:flex;flex-direction:column;min-width:0}
  .acct-user-tx b{font-size:15px;color:var(--ink);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .acct-user-tx span{font-size:12.5px;color:var(--ink-mute)}
  .acct-nav{display:flex;flex-direction:column;gap:3px}
  .acct-navi{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:11px;cursor:pointer;
       font-size:14.5px;font-weight:600;color:var(--ink-soft);text-align:left;transition:background .18s,color .18s;width:100%}
  .acct-navi svg{width:18px;height:18px;color:var(--ink-mute);flex:none;transition:color .18s}
  .acct-navi:hover{background:var(--bg-warm)}
  .acct-navi.on{background:var(--accent-tint);color:var(--accent-deep)}
  .acct-navi.on svg{color:var(--accent)}
  .acct-navi.danger{color:#a4341f}
  .acct-navi.danger svg{color:#c04a2c}
  .acct-navi.danger:hover{background:#fbe9e4}
  .acct-logout{display:flex;align-items:center;gap:11px;padding:11px 13px;margin-top:12px;border-top:1px solid var(--line-soft);
       padding-top:16px;width:100%;font-size:14px;font-weight:600;color:var(--ink-mute);cursor:pointer;border-radius:0}
  .acct-logout svg{width:18px;height:18px;flex:none}
  .acct-logout:hover{color:var(--accent)}

  .acct-main{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:32px 34px;box-shadow:var(--shadow-sm);min-height:420px}
  .acct-head{margin-bottom:24px}
  .acct-head h1{font-family:var(--serif);font-size:25px;font-weight:600;letter-spacing:-.02em}
  .acct-head p{font-size:14px;color:var(--ink-mute);margin-top:6px}
  .acct-main .reg-submit{margin-top:22px;max-width:320px}
  .acct-sub{font-family:var(--serif);font-size:17px;font-weight:600;margin:28px 0 14px;letter-spacing:-.01em}

  /* Plan actual */
  .acct-plan-current{border:1px solid var(--accent-soft);background:var(--accent-tint);border-radius:16px;padding:24px 26px}
  .acct-plan-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
  .acct-plan-lbl{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:5px}
  .acct-plan-top h2{font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:-.01em}
  .acct-plan-price{text-align:right;white-space:nowrap;display:flex;flex-direction:column;align-items:flex-end;gap:0}
  .acct-plan-amount{display:flex;align-items:baseline;gap:4px}
  .acct-plan-price b{font-family:var(--serif);font-size:26px;font-weight:700}
  .acct-plan-price span{font-size:14px;color:var(--ink-mute);font-weight:600}
  .acct-plan-free{font-style:normal;font-size:11.5px;font-weight:700;color:var(--accent);
       background:var(--paper);border:1px solid var(--accent-soft);border-radius:999px;padding:3px 10px;margin-top:8px;white-space:nowrap}
  .acct-plan-others{display:flex;flex-direction:column;gap:12px}
  .plan-mini{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;border:1px solid var(--line);border-radius:13px}
  .plan-mini b{font-size:15px}
  .plan-mini span{font-size:13.5px;color:var(--ink-mute);margin-left:10px}

  /* Suscripción */
  .acct-box{border:1px solid var(--line);border-radius:14px;overflow:hidden}
  .acct-box-row{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;font-size:14.5px;border-bottom:1px solid var(--line-soft)}
  .acct-box-row:last-child{border-bottom:none}
  .acct-box-row span{color:var(--ink-mute)}
  .acct-box-row b{color:var(--ink);font-weight:700}
  .acct-badge{background:var(--accent-tint);color:var(--accent-deep);font-size:12.5px;padding:4px 11px;border-radius:999px}
  .acct-pay{display:flex;align-items:center;gap:15px;padding:18px 20px;border:1px dashed var(--line);border-radius:14px}
  .acct-pay-ic{width:44px;height:44px;border-radius:11px;background:var(--bg-warm);color:var(--ink-soft);display:grid;place-items:center;flex:none}
  .acct-pay-ic svg{width:21px;height:21px}
  .acct-pay-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .acct-pay-tx b{font-size:14.5px}
  .acct-pay-tx span{font-size:13px;color:var(--ink-mute);line-height:1.4}
  .acct-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
  .acct-actions .btn{height:46px}

  /* Eliminar cuenta */
  .acct-danger{display:flex;gap:15px;padding:20px;border:1px solid #f0cfc4;background:#fcf0ec;border-radius:14px}
  .acct-danger-ic{width:44px;height:44px;border-radius:11px;background:#f7ddd4;color:#bb3f23;display:grid;place-items:center;flex:none}
  .acct-danger-ic svg{width:22px;height:22px}
  .acct-danger-tx b{font-size:15px;color:#a4341f;display:block;margin-bottom:4px}
  .acct-danger-tx span{font-size:13.5px;color:var(--ink-soft);line-height:1.5}
  .acct-check{display:flex;align-items:center;gap:10px;margin:20px 0;font-size:14px;color:var(--ink-soft);cursor:pointer}
  .acct-check input{width:17px;height:17px;accent-color:#bb3f23;flex:none}
  .acct-del-btn{background:#bb3f23;color:#fff;height:48px}
  .acct-del-btn:hover:not(:disabled){background:#a4341f;transform:translateY(-1px)}
  .acct-del-btn:disabled{opacity:.45;cursor:not-allowed}

  .nav-session{cursor:pointer}
  /* En el área privada: ocultar footer público para sensación de dashboard */
  body.on-account footer{display:none}
  body.on-account{background:var(--bg-warm)}

  /* Mode selector (Abogado vs Despacho) */
  .reg-modepick{margin-bottom:32px}
  .reg-modepick .reg-lbl{display:block;margin-bottom:12px}
  .reg-modes{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .reg-mode{position:relative;display:flex;align-items:center;gap:13px;text-align:left;padding:18px 18px;cursor:pointer;
       background:var(--paper);border:2px solid var(--line);border-radius:14px;transition:all .18s}
  .reg-mode:hover{border-color:var(--ink-mute);background:var(--bg-warm)}
  .reg-mode.active{border-color:var(--accent);background:var(--accent-tint)}
  .reg-mode-ic{width:44px;height:44px;flex:none;border-radius:11px;background:var(--bg-warm);border:1px solid var(--line);
       display:grid;place-items:center;color:var(--ink-soft);transition:all .18s}
  .reg-mode-ic svg{width:21px;height:21px;stroke-width:1.7}
  .reg-mode.active .reg-mode-ic{background:var(--accent);border-color:var(--accent);color:#fff}
  .reg-mode-tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
  .reg-mode-tx b{font-family:var(--serif);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
  .reg-mode.active .reg-mode-tx b{color:var(--accent-deep)}
  .reg-mode-tx em{font-style:normal;font-size:12px;color:var(--ink-mute);line-height:1.35}
  .reg-mode-check{position:absolute;top:12px;right:12px;width:20px;height:20px;border-radius:50%;
       background:var(--accent);color:#fff;display:none;place-items:center}
  .reg-mode-check svg{width:13px;height:13px;stroke-width:3}
  .reg-mode.active .reg-mode-check{display:grid}
  /* Square logo avatar variant */
  .reg-avatar-sq{border-radius:16px}
  /* Section title row with plan pill + section description */
  .reg-sec-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .reg-sec-title-l{display:flex;align-items:center;gap:9px;color:var(--accent)}
  .reg-sec-title-l svg{width:19px;height:19px;stroke-width:1.7}
  .reg-sec-title-l h3{font-family:var(--serif);font-size:16.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
  .reg-plan-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--accent-deep);
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:999px;padding:5px 11px;letter-spacing:.005em}
  .reg-plan-pill svg{width:13px;height:13px;stroke-width:1.9}
  .reg-sec-desc{font-size:13px;color:var(--ink-mute);line-height:1.55;margin:-8px 0 16px;max-width:62ch}
  /* ---- Acordeón del registro (móvil) ---- */
  .reg-sec.reg-acc{padding-bottom:0;margin-bottom:12px;border-bottom:none;
       border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper)}
  .reg-acc .reg-sec-title{margin-bottom:0;cursor:pointer;display:flex;align-items:center;gap:9px;
       padding:15px 16px;position:relative;-webkit-tap-highlight-color:transparent}
  .reg-acc .reg-sec-title .reg-acc-chev{margin-left:auto;color:var(--ink-mute);display:grid;place-items:center;
       transition:transform .28s cubic-bezier(.16,1,.3,1)}
  .reg-acc .reg-sec-title .reg-acc-chev svg{width:18px;height:18px;stroke-width:2.2}
  .reg-acc.reg-acc-open .reg-sec-title .reg-acc-chev{transform:rotate(180deg)}
  .reg-acc.reg-acc-open .reg-sec-title{border-bottom:1px solid var(--line-soft)}
  .reg-acc .reg-acc-body{max-height:0;overflow:hidden;opacity:0;
       transition:max-height .34s cubic-bezier(.16,1,.3,1),opacity .26s ease,padding .34s cubic-bezier(.16,1,.3,1);
       padding:0 16px}
  .reg-acc.reg-acc-open .reg-acc-body{max-height:4000px;opacity:1;padding:16px}
  .reg-acc .reg-acc-done{margin-left:auto;width:18px;height:18px;border-radius:50%;background:var(--accent);
       display:none;place-items:center;color:#fff;flex:none}
  .reg-acc .reg-acc-done svg{width:11px;height:11px;stroke-width:3}
  .reg-acc.reg-acc-filled .reg-acc-done{display:grid}
  .reg-acc.reg-acc-filled .reg-acc-chev{margin-left:8px}
  /* ---- Planes y suscripción (dentro del registro) ---- */
  .reg-plansec{border-bottom:none;margin-bottom:18px;padding-bottom:6px;
       border-top:1px solid var(--line-soft);padding-top:32px}
  .regplans{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .regplan{position:relative;display:flex;flex-direction:column;text-align:left;cursor:pointer;
       background:var(--paper);border:1px solid var(--line);border-radius:16px;
       padding:18px 18px 20px;font-family:var(--sans);
       transition:border-color .18s, box-shadow .18s, background .18s}
  .regplan:hover{border-color:var(--accent-soft)}
  .regplan.on{border-color:var(--accent-soft);box-shadow:0 0 0 1px var(--accent-soft)}
  .regplan-feat{background:linear-gradient(180deg,#fffdfb, #fffaf6)}
  .regplan-radio{position:absolute;top:16px;right:16px;width:22px;height:22px;border-radius:50%;
       border:1.5px solid var(--line);background:var(--paper);display:grid;place-items:center;
       color:#fff;transition:.18s}
  .regplan-radio svg{width:13px;height:13px;stroke-width:3;opacity:0;transition:opacity .15s}
  .regplan.on .regplan-radio{background:var(--accent);border-color:var(--accent)}
  .regplan.on .regplan-radio svg{opacity:1}
  .regplan-top{display:flex;flex-direction:column;gap:3px;padding-right:30px}
  .regplan-name{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-.01em;
       display:inline-flex;align-items:center;gap:9px}
  .regplan-tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--sans);font-style:normal;
       font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;
       background:linear-gradient(135deg, var(--accent) 0%, var(--accent-deep) 100%);
       border-radius:999px;padding:4px 11px 4px 9px;
       box-shadow:0 3px 10px -3px rgba(231,98,79,.55), inset 0 1px 0 rgba(255,255,255,.22)}
  .regplan-tag svg{width:12px;height:12px;stroke-width:0;color:#fff}
  .regplan-tagline{font-size:12.5px;color:var(--ink-mute);line-height:1.45}
  .regplan-price{display:flex;align-items:baseline;gap:7px;margin:14px 0 2px;flex-wrap:wrap}
  .regplan-price b{font-family:var(--serif);font-size:26px;font-weight:700;color:var(--ink);letter-spacing:-.02em}
  .regplan-price span{font-size:13px;color:var(--ink-mute);font-weight:600}
  .regplan-free-amount{color:var(--accent-deep)!important}
  .regplan-soon{font-size:17px!important;color:var(--ink-soft)!important}
  /* Premium "próximamente": no seleccionable, píldora gris y nota */
  .regplan-soon-card{cursor:default}
  .regplan-soon-card:hover{border-color:var(--line)}
  .regplan-soonpill{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-bottom:14px;
       font-size:10.5px;font-weight:700;letter-spacing:.02em;color:var(--ink-mute);
       background:var(--bg-warm);border:1px solid var(--line);border-radius:999px;padding:5px 11px}
  .regplan-soonpill svg{width:12px;height:12px;color:var(--ink-mute);stroke-width:1.9}
  .regplan-top.no-radio{padding-right:0}
  .regplan-soonnote{font-size:12.5px;color:var(--ink-mute);line-height:1.5;margin:12px 0 0}
  .regplan-soonword{display:block;margin-top:14px;font-size:13px;font-weight:700;color:var(--ink-mute)}
  /* Caja de interés / lista de espera del Plan Premium */
  .regplan-interest{display:flex;flex-direction:column;gap:14px;
       margin-top:16px;padding:22px 24px;background:var(--bg-warm);border:1px solid var(--line-soft);border-radius:16px}
  .regplan-interest-tx b{font-family:var(--serif);font-size:16px;font-weight:700;color:var(--ink);display:block;margin-bottom:5px}
  .regplan-interest-tx p{font-size:13.5px;color:var(--ink-soft);line-height:1.5;margin:0;max-width:62ch}
  .regplan-interest-form{display:flex;gap:10px;align-items:stretch}
  .regplan-interest-input{flex:1;min-width:0;height:48px;border:1px solid var(--line);border-radius:11px;
       padding:0 15px;font-family:inherit;font-size:14.5px;background:var(--paper);color:var(--ink);transition:border-color .2s, box-shadow .2s}
  .regplan-interest-input::placeholder{color:var(--ink-mute)}
  .regplan-interest-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
  .regplan-interest-btn{flex:none;height:48px;padding:0 22px;font-size:14.5px;white-space:nowrap}
  .regplan-was{font-size:12px;color:var(--ink-mute);font-weight:500;text-decoration:line-through;opacity:.75}
  .regplan-badge{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:10px;
       font-size:11.5px;font-weight:800;letter-spacing:.005em;color:var(--accent-deep);
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:999px;padding:6px 12px}
  .regplan-badge svg{width:14px;height:14px;stroke-width:1.9}
  .regplan-hl{display:flex;align-items:center;gap:8px;margin-top:12px;padding:9px 12px;
       font-size:12.5px;font-weight:700;color:var(--accent-deep);line-height:1.35;
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:11px}
  .regplan-hl svg{width:15px;height:15px;stroke-width:1.9;color:var(--accent);flex:none}
  .regplan-nocard{display:flex;align-items:center;gap:7px;margin-top:9px;
       font-size:11.5px;font-weight:600;color:var(--ink-mute);letter-spacing:.005em}
  .regplan-nocard svg{width:13px;height:13px;stroke-width:1.9;color:var(--ink-mute);flex:none}
  .regplan-bens-wrap{margin-top:16px;padding-top:15px;border-top:1px solid var(--line-soft)}
  .regplan-bens{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0;padding:0}
  .regplan-bens li{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--ink-soft);line-height:1.4}
  .regplan-bens li svg{width:15px;height:15px;stroke-width:2.4;color:var(--accent);flex:none;margin-top:1px}
  .reg-plan-switch{display:flex;align-items:center;gap:8px;margin-top:16px;
       font-size:12.5px;font-weight:600;color:var(--ink-mute)}
  .reg-plan-switch svg{width:15px;height:15px;stroke-width:1.8;color:var(--accent);flex:none}
  /* Dynamic lawyer cards */
  .reg-lawyers{display:flex;flex-direction:column;gap:16px;margin-bottom:16px}
  .reg-lawcard{border:1px solid var(--line);border-radius:16px;background:var(--bg);padding:20px 20px 6px;
       animation:fade .35s ease both}
  .reg-lawcard-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
  .reg-lawcard-num{font-family:var(--serif);font-size:13px;font-weight:700;color:var(--accent-deep);
       background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:999px;padding:5px 13px;letter-spacing:.01em}
  .reg-lawcard-del{display:inline-flex;align-items:center;gap:6px;font-family:var(--sans);font-size:12.5px;font-weight:600;
       color:var(--ink-mute);background:none;border:none;cursor:pointer;padding:5px 6px;border-radius:8px;transition:color .15s,background .15s}
  .reg-lawcard-del svg{width:14px;height:14px;stroke-width:1.8}
  .reg-lawcard-del:hover{color:var(--accent-deep);background:var(--accent-tint)}
  .reg-lawcard .reg-avatar{width:84px;height:84px}
  .reg-lawcard .reg-avatar svg{width:20px;height:20px}
  .reg-lawcard .reg-photo{width:auto}
  .reg-chip-sm{font-size:12.5px;padding:7px 13px}
  /* Add lawyer button */
  .reg-addbtn{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;height:50px;
       font-family:var(--sans);font-size:14.5px;font-weight:700;color:var(--accent-deep);cursor:pointer;
       background:var(--accent-tint);border:1.5px dashed var(--accent-soft);border-radius:13px;transition:all .18s}
  .reg-addbtn svg{width:17px;height:17px;stroke-width:2;transform:rotate(90deg)}
  .reg-addbtn:hover{background:var(--accent-soft);border-color:var(--accent)}
  .reg-addbtn.is-disabled{color:var(--ink-mute);background:var(--bg-warm);border-color:var(--line);
       border-style:solid;cursor:not-allowed}
  .reg-addbtn.is-disabled svg{transform:none;color:var(--ink-mute)}

  /* ---------- Footer ---------- */
  footer{background:var(--bg-warm);border-top:1px solid var(--line);margin-top:40px;padding:54px 0 30px}
  /* Bloque permanente "¿Necesitas ayuda?" en el footer */
  .foot-help{display:flex;align-items:center;justify-content:space-between;gap:32px;
       background:var(--paper);border:1px solid var(--line);border-radius:18px;
       padding:26px 30px;margin-bottom:42px;box-shadow:var(--shadow-sm)}
  .foot-help-tx{flex:1;min-width:260px}
  .foot-help-tx h3{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:-.01em;color:var(--ink);margin-bottom:10px}
  .foot-help-tx ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
  .foot-help-tx li{font-size:14px;color:var(--ink-soft);line-height:1.5;padding-left:18px;position:relative}
  .foot-help-tx li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
  .foot-help-btn{flex:none;display:inline-flex;align-items:center;gap:9px;height:48px;padding:0 24px;
       font-size:14.5px;font-weight:700;border-radius:11px;letter-spacing:-.005em}
  .foot-help-btn svg{width:17px;height:17px}
  /* list-help reutilizado en registro y about: separación adecuada */
  .reg-help-band{margin:18px 0 4px;max-width:none}
  .ab-help-band{margin:28px 0 0}
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px}
  .foot-brand .logo{font-size:24px;margin-bottom:14px}
  .foot-brand p{font-size:13px;color:var(--ink-mute);max-width:30ch}
  .foot-col h4{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
       color:var(--ink-mute);margin-bottom:16px}
  .foot-col a{display:block;font-size:14px;color:var(--ink-soft);margin-bottom:10px;transition:color .2s}
  .foot-col a:hover{color:var(--accent)}
  .socials{display:flex;gap:12px}
  .socials a{width:38px;height:38px;border-radius:9px;border:1px solid var(--line);
       display:grid;place-items:center;color:var(--ink-soft);transition:.2s}
  .socials a:hover{border-color:var(--accent);color:var(--accent);background:var(--paper)}
  .socials svg{width:18px;height:18px}
  .foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
       margin-top:42px;padding-top:24px;border-top:1px solid var(--line)}
  .foot-bottom .copy{font-size:12.5px;color:var(--ink-mute)}
  .foot-bottom .legal{display:flex;gap:20px}
  .foot-bottom .legal a{font-size:12.5px;color:var(--ink-mute)}
  .foot-bottom .legal a:hover{color:var(--accent)}

  /* ---------- Breadcrumb ---------- */
  .crumb{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--ink-mute);
       padding:26px 0 4px;flex-wrap:wrap}
  .crumb a{color:var(--ink-mute);transition:color .2s}
  .crumb a:hover{color:var(--accent)}
  .crumb .sep{opacity:.5}
  .crumb .cur{color:var(--ink-soft);font-weight:600}
  /* "Volver a resultados": solo visible en móvil (en desktop manda el breadcrumb) */
  .crumb-back{display:none}

  /* ---------- SPECIALTIES (casos legales) ---------- */
  .spec-head{padding:14px 0 38px}
  .spec-head .eyebrow{margin-bottom:14px}
  .spec-head h1{font-family:var(--serif);font-size:clamp(24px,2.9vw,34px);font-weight:600;line-height:1.12;
       letter-spacing:-.02em;max-width:20ch}
  .spec-head .spec-sub{font-size:16.5px;color:var(--ink-soft);margin-top:14px;max-width:54ch;line-height:1.5}
  .spec-head{padding:14px 0 30px}
  .spec-head .eyebrow{margin-bottom:14px}
  .spec-head h1{font-family:var(--serif);font-size:clamp(24px,2.9vw,34px);font-weight:700;line-height:1.1;
       letter-spacing:-.025em;max-width:20ch}
  .spec-head .spec-sub{font-size:16.5px;color:var(--ink-soft);margin-top:14px;max-width:54ch;line-height:1.5}
  /* mini-stats bajo el subtítulo */
  .spec-stats{display:flex;flex-wrap:wrap;gap:11px 28px;margin-top:24px}
  .spec-stats .st{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink-soft)}
  .spec-stats .st svg{width:16px;height:16px;color:var(--accent);flex:none;stroke-width:2.2}

  /* categorías */
  .spec-cat{margin-bottom:8px}
  .spec-cat + .spec-cat{margin-top:54px}
  .spec-cat-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}
  .spec-cat-head h2{font-family:var(--serif);font-size:22px;font-weight:700;letter-spacing:-.015em;flex:none}
  .spec-cat-head .ln{flex:1;height:1px;background:var(--line-soft)}

  /* cards verticales, minimalistas */
  .spec-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-bottom:4px}
  .spec-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;
       padding:28px 26px 22px;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;
       box-shadow:var(--shadow-sm);transition:transform .26s cubic-bezier(.16,1,.3,1), box-shadow .26s ease, border-color .26s ease}
  .spec-card:hover{transform:translateY(-6px);box-shadow:0 22px 44px -18px rgba(40,30,15,.30);border-color:var(--accent-soft)}
  .spec-ic{width:64px;height:64px;border-radius:19px;background:var(--accent-soft);display:grid;place-items:center;
       color:var(--accent-deep);margin-bottom:20px;transition:transform .26s ease, background .26s ease, color .26s ease}
  .spec-ic svg{width:32px;height:32px;stroke-width:1.65}
  .spec-card:hover .spec-ic{transform:scale(1.06);background:var(--accent);color:#fff}
  .spec-card h3{font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:-.015em;line-height:1.18;margin-bottom:8px}
  .spec-card p{font-size:13.5px;color:var(--ink-mute);line-height:1.5;margin-bottom:20px;
       display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .spec-foot{margin-top:auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
       padding-top:15px;border-top:1px solid var(--line-soft)}
  .spec-count{display:inline-flex;align-items:baseline;gap:5px;font-size:13px;font-weight:700;color:var(--ink-soft)}
  .spec-count b{font-size:18px;font-weight:800;color:var(--accent-deep);letter-spacing:-.02em}
  .spec-go{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;
       color:var(--ink-mute);letter-spacing:-.005em;transition:gap .2s, color .2s}
  .spec-go svg{width:14px;height:14px}
  .spec-card:hover .spec-go{gap:9px;color:var(--accent)}

  /* caja de ayuda inferior */
  .spec-help{background:var(--bg-warm);border:1px solid var(--line-soft);border-radius:26px;padding:48px 40px;text-align:center;margin-top:52px}
  .spec-help h2{font-family:var(--serif);font-size:27px;font-weight:700;letter-spacing:-.02em}
  .spec-help p{font-size:16px;color:var(--ink-soft);margin:11px auto 24px;max-width:48ch;line-height:1.55}
  .spec-help .btn{height:52px;padding:0 34px;font-size:15px}

  /* ---------- LISTING ---------- */
  .listing-head{padding:14px 0 34px}
  .listing-head h1{font-family:var(--serif);font-size:clamp(19px,2.7vw,32px);font-weight:600;line-height:1.15;
       letter-spacing:-.02em}
  .filter-bar{background:var(--paper);border:1px solid var(--line);border-radius:12px;
       padding:12px 16px;display:flex;align-items:center;justify-content:space-between;
       gap:16px;flex-wrap:wrap;box-shadow:var(--shadow-sm);margin-bottom:36px}
  .filter-bar .fg{display:flex;align-items:center;gap:10px}
  .filter-bar .fg label{font-size:12px;font-weight:700;color:var(--ink-mute);text-transform:uppercase;
       letter-spacing:.06em;display:flex;align-items:center;gap:6px}
  .filter-bar .fg label svg{width:15px;height:15px;color:var(--accent)}
  .filter-bar select{height:40px;padding:0 34px 0 13px;border-radius:9px;font-size:13.5px;font-weight:600;
       width:auto;min-width:150px;border-color:var(--line)}
  .filter-bar select:hover{border-color:var(--ink-mute)}
  .filter-bar .fg .sw{position:relative}
  .filter-bar .fg .sw .chev{position:absolute;right:13px;top:50%;transform:translateY(-50%);width:12px;height:12px;color:var(--ink-mute);pointer-events:none;display:flex;align-items:center;justify-content:center}
  .filter-bar .fg .sw .chev svg{width:12px;height:12px}

  /* ===== Listing card (premium, photo-led, fast to scan) =====
     Estructura única (idéntica jerarquía móvil/desktop):
       Nombre · Despacho · Ubicación · Especialidades · Modalidad · Ver perfil
     Layout: CSS Grid.
     Desktop: 3 columnas — foto (rectangular), info y acción (botón a la derecha,
     centrado verticalmente). Distribución equilibrada de tres bloques.
     Móvil: 2 columnas — avatar circular arriba a la izquierda con el nombre al lado,
     y el resto de info a ancho completo abajo. */
  .lcard-list{display:block}
  .lcard{background:var(--paper);border:1px solid transparent;border-radius:22px;
       overflow:hidden;cursor:pointer;margin-bottom:18px;
       box-shadow:0 1px 3px rgba(40,30,15,.04), 0 12px 30px -16px rgba(40,30,15,.12);
       transition:transform .3s var(--ease), box-shadow .3s var(--ease);
       display:grid;grid-template-columns:236px 1fr auto;
       grid-template-areas:"photo name action" "photo body action"}
  .lcard:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 18px 44px -18px rgba(40,30,15,.20)}
  .lcard-photo{grid-area:photo;position:relative;background:var(--bg-warm);overflow:hidden;
       margin:16px 0 16px 16px;border-radius:18px}
  .lcard-photo img{width:100%;height:100%;object-fit:cover;object-position:center 38%;transition:transform .5s;display:block}
  .lcard:hover .lcard-photo img{transform:scale(1.04)}
  .lcard-feat{position:absolute;top:11px;left:11px;right:auto;display:inline-flex;align-items:center;gap:4px;
       background:var(--accent-tint);color:var(--accent-deep);font-size:9.5px;font-weight:600;
       letter-spacing:.05em;padding:3px 9px;border-radius:999px;
       box-shadow:0 1px 3px rgba(40,30,15,.12);z-index:3}
  /* Nombre del abogado: principal, en la cabecera de la columna central */
  .lcard-name{grid-area:name;font-family:var(--serif);font-size:27px;font-weight:700;line-height:1.1;
       letter-spacing:-.018em;color:var(--ink);margin:0;padding:26px 30px 0}
  /* Body: el resto de info apilada en una sola columna (jerarquía clara, sin huecos) */
  .lcard-body{grid-area:body;min-width:0;padding:6px 30px 26px;display:flex;flex-direction:column}
  /* Despacho: secundario, gris medio, pegado al nombre */
  .lcard-firm{font-size:12.5px;font-weight:600;color:var(--ink-mute);letter-spacing:-.005em;margin-top:3px;
       transition:color .2s;line-height:1.3;align-self:flex-start}
  .lcard-firm:not(.indep):hover{color:var(--accent)}
  .lcard-firm.indep{font-weight:600;color:var(--ink-mute);font-style:italic;font-size:13px}
  /* Ubicación: secundaria, gris suave y pequeña */
  .lcard-loc{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:var(--ink-mute);margin-top:7px;align-self:flex-start}
  .lcard-loc svg{width:12.5px;height:12.5px;color:var(--ink-mute);flex:none;stroke-width:1.7}
  /* Descripción profesional: máximo 2 líneas, truncada con … */
  .lcard-desc{font-size:13.5px;color:var(--ink-soft);font-weight:500;line-height:1.5;
       margin-top:10px;letter-spacing:-.005em;
       display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
       max-width:62ch}
  .lc-dot{width:3px;height:3px;border-radius:50%;background:var(--ink-mute);opacity:.4;flex:none}
  /* Especialidades */
  .lcard-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
  .lc-pill{font-size:11.5px;font-weight:600;color:var(--accent-deep);background:var(--accent-tint);
       border:1px solid rgba(231,98,79,.08);padding:3px 12px;border-radius:999px;
       letter-spacing:-.005em;white-space:nowrap;line-height:1.5}
  .lc-pill-more{font-size:11.5px;font-weight:600;color:var(--ink-mute);background:var(--bg-warm);
       border:1px solid var(--line);padding:3px 12px;border-radius:999px;
       letter-spacing:-.005em;white-space:nowrap;line-height:1.5}
  /* Modalidad de atención: una sola línea, gris suave y discreta */
  .lcard-trustline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}
  .lc-verif{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;
       color:var(--ink-mute);letter-spacing:-.005em;white-space:nowrap}
  .lc-verif svg{width:13px;height:13px;color:var(--ink-mute);flex:none;stroke-width:2}
  .lcard-attn{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink-mute);white-space:nowrap}
  .lcard-attn svg{width:13px;height:13px;color:var(--ink-mute);flex:none;stroke-width:1.7}
  /* Botón: columna propia a la derecha, centrado verticalmente para equilibrar la card */
  .lcard-cta{grid-area:action;align-self:center;justify-self:end;display:inline-flex;align-items:center;
       justify-content:center;gap:7px;height:54px;padding:0 40px;margin:0 24px 0 14px;
       font-size:15px;font-weight:700;border-radius:999px;
       background:var(--accent);color:#fff;border:1.5px solid var(--accent);letter-spacing:-.005em;white-space:nowrap;
       box-shadow:none;transition:background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s}
  .lcard-cta svg{width:15px;height:15px;transition:transform .2s}
  .lcard:hover .lcard-cta{background:var(--accent-deep);border-color:var(--accent-deep);box-shadow:0 6px 18px -8px rgba(231,98,79,.34)}
  .lcard-cta:hover{transform:translateY(-1px)}
  .lcard:hover .lcard-cta svg{transform:translateX(3px)}
  .firm-mono{font-family:var(--serif);line-height:1}
  .firm-mono .big{font-size:24px;font-weight:700;letter-spacing:-.5px}
  .firm-mono .small{font-size:7px;font-weight:700;letter-spacing:.14em;margin-top:4px;font-family:var(--sans)}
  .firm-badge{width:84px;height:64px;border-radius:10px;display:grid;place-items:center;margin:0 auto;
       border:1px solid var(--line-soft);background:var(--bg-warm)}

  /* ===== GRID CARDS (alternativa para Recomendados de la home) =====
     Cards verticales 3 x fila en desktop, 2 en tablet.
     Foto protagonista pero con altura reducida (~20%) para dar más peso a la
     información profesional. Móvil renderiza otra versión (cards horizontales). */
  .lcardg-list{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .lcardg{background:var(--paper);border:1px solid var(--line-soft);border-radius:22px;overflow:hidden;
       cursor:pointer;box-shadow:var(--shadow-sm);
       transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
       display:flex;flex-direction:column}
  .lcardg:hover{transform:translateY(-3px) scale(1.012);box-shadow:0 18px 40px -20px rgba(40,30,15,.22);border-color:var(--accent-soft)}
  /* Foto con aspect-ratio 5:3 (≈20% menos alta que el 4:3 anterior) */
  .lcardg-photo{position:relative;aspect-ratio:4/3;background:var(--bg-warm);overflow:hidden}
  .lcardg-photo img{width:100%;height:100%;object-fit:cover;object-position:center 28%;transition:transform .55s;display:block}
  .lcardg:hover .lcardg-photo img{transform:scale(1.04)}
  /* Gradient sutil bajo la mitad inferior para legibilidad del overlay */
  .lcardg-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
       background:linear-gradient(to bottom, transparent 0%, rgba(20,18,15,.78) 100%);pointer-events:none}
  /* encuadre uniforme: misma línea de ojos en todas las fotos */
  .lcardg-photo img[data-face="ana"]{object-position:center 22%}
  .lcardg-photo img[data-face="gerardo"]{object-position:center 24%}
  .lcardg-photo img[data-face="marta"]{object-position:center 22%}
  .lcardg-photo img[data-face="javier"]{object-position:center 22%}
  .lcardg-photo img[data-face="raquel"]{object-position:center 26%}
  .lcardg-photo img[data-face="david"]{object-position:center 22%}
  .lcardg-photo img[data-face="carlos"]{object-position:center 20%}
  .lcardg-photo img[data-face="paula"]{object-position:center 24%}
  /* Badge "Destacado" más pequeño y discreto */
  .lcardg-feat{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.88);backdrop-filter:blur(6px);
       color:var(--accent-deep);font-size:8.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
       padding:3px 8px;border-radius:5px;z-index:2;box-shadow:0 1px 3px rgba(40,30,15,.08)}
  /* Overlay: nombre + ciudad sobre la foto, abajo a la izquierda */
  .lcardg-overlay{position:absolute;left:20px;right:20px;bottom:20px;z-index:2;color:#fff}
  .lcardg-name{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 7px;font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:-.01em;
       line-height:1.15;margin:0 0 7px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.35)}
  .lcardg-city{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:500;
       color:rgba(255,255,255,.8);text-shadow:0 1px 4px rgba(0,0,0,.35)}
  .lcardg-city svg{width:12.5px;height:12.5px;stroke-width:1.8;flex:none;color:rgba(255,255,255,.8)}
  /* Body bajo la foto: más aire vertical para una lectura limpia y premium.
     Solo 3 datos (despacho · especialidades · años) + CTA, bien espaciados. */
  .lcardg-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
  /* Despacho: dato secundario y discreto, sin robar protagonismo al nombre */
  .lcardg-firm{font-size:12.5px;font-weight:600;color:var(--ink-soft);letter-spacing:.005em;
       transition:color .2s;line-height:1.3;margin:0;
       white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lcardg-firm:not(.indep):hover{color:var(--accent)}
  .lcardg-firm.indep{font-style:italic;color:var(--ink-mute)}
  /* Especialidades en UNA SOLA línea: "Herencias · Particiones · +2".
     Es el dato más escaneable de la card, por eso lleva el peso visual. */
  .lcardg-specs{font-size:14px;color:var(--ink);font-weight:600;margin-top:9px;line-height:1.4;
       letter-spacing:-.005em;
       white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lcardg-specs .lcardg-more{color:var(--ink-mute);font-weight:600}
  /* Años de experiencia: diferenciador rápido para comparar perfiles */
  .lcardg-exp{display:inline-flex;align-items:center;gap:7px;margin-top:13px;
       font-size:12.5px;font-weight:600;color:var(--ink-soft);letter-spacing:-.005em;
       white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lcardg-exp svg{width:13px;height:13px;color:var(--accent);flex:none;stroke-width:1.7}
  /* CTA: color de marca unificado e idéntico en las tres cards (sin salto de color
     al hacer hover; solo realce sutil). margin-top:auto lo fija al fondo y alinea
     el botón entre cards; el aire vertical lo da el padding del body. */
  .lcardg-cta{margin-top:22px;width:100%;display:inline-flex;align-items:center;justify-content:center;gap:6px;
       height:44px;padding:0 18px;font-size:13.5px;font-weight:700;border-radius:11px;
       background:var(--accent);color:#fff;letter-spacing:-.005em;
       box-shadow:0 1px 2px rgba(231,98,79,.18);transition:background .2s, transform .2s, box-shadow .2s}
  .lcardg-cta svg{width:14px;height:14px;transition:transform .2s}
  .lcardg:hover .lcardg-cta{background:var(--accent-deep);box-shadow:0 4px 12px rgba(231,98,79,.24)}
  .lcardg-cta:hover{transform:translateY(-1px)}
  .lcardg:hover .lcardg-cta svg{transform:translateX(3px)}
  /* --- Card limpia: especialidad (color) + valoración --- */
  .lcardg-spec{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-.01em;line-height:1.3}
  .lcardg-rate{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:13px;font-weight:600;color:var(--ink-mute)}
  .lcardg-rate .lcardg-star{width:15px;height:15px;color:var(--accent);display:inline-flex;flex:none}
  .lcardg-rate .lcardg-star svg{width:15px;height:15px}
  .lcardg-rate b{color:var(--ink);font-weight:800}
  .lcardg-rate .lcardg-sep{color:var(--ink-mute);opacity:.7;font-weight:700}
  .lcardg-rate .lcardg-yrs{color:var(--ink-mute)}

  /* ===== Opción A: información debajo de la foto (foto limpia) ===== */
  .lcardg-photo::after{display:none}
  .lcardg-name{position:static;color:var(--ink);font-size:18.5px;font-weight:600;text-shadow:none;
       margin:0 0 11px;display:flex;align-items:baseline;flex-wrap:wrap;gap:0 6px;line-height:1.2}
  .lcardg-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
  .lcardg-pill{display:inline-block;background:var(--accent-tint);color:var(--accent-deep);
       border:1px solid var(--accent-soft);font-size:11.5px;font-weight:700;padding:4px 11px;
       border-radius:999px;letter-spacing:.01em}
  .lcardg-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--ink-mute);font-size:12.5px;font-weight:600}
  .lcardg-m{display:inline-flex;align-items:center;gap:5px}
  .lcardg-m svg{width:14px;height:14px;color:var(--accent);flex:none;stroke-width:1.8}
  .lcardg-div{height:1px;background:var(--line-soft);margin-top:14px}
  .lcardg-cta{margin-top:13px;width:100%;height:auto;padding:0;background:none;box-shadow:none;border-radius:0;
       display:flex;align-items:center;justify-content:space-between;color:var(--ink);font-size:13.5px;font-weight:700}
  .lcardg-cta:hover{transform:none}
  .lcardg:hover .lcardg-cta{background:none;box-shadow:none;color:var(--ink);transform:none}
  .lcardg-arrow{width:34px;height:34px;border-radius:50%;background:var(--accent-tint);color:var(--accent);
       display:inline-flex;align-items:center;justify-content:center;transition:background .2s, color .2s, transform .2s}
  .lcardg-arrow svg{width:15px;height:15px}
  .lcardg:hover .lcardg-cta svg{transform:none}
  .lcardg:hover .lcardg-arrow{background:var(--accent);color:#fff;transform:translateX(2px)}

  /* ===== Ajustes SOLO DESKTOP (≥641px) ===== */
  @media(min-width:641px){
    /* en el perfil (desktop) se elimina el CTA secundario: se solapa con el CTA inferior
       y repite el mensaje. En móvil se mantiene porque ayuda a la conversión. */
    #view-lawyer .cta-mini{display:none}
  }

  .show-more{width:100%;background:var(--bg-warm);border:1px solid var(--line);border-radius:12px;
       padding:16px;text-align:center;font-weight:700;font-size:15px;color:var(--ink-soft);
       display:flex;align-items:center;justify-content:center;gap:9px;transition:.2s;margin-top:6px}
  .show-more:hover{background:var(--accent-tint);color:var(--accent);border-color:var(--accent-soft)}
  .show-more svg{width:15px;height:15px}

  /* CTA discreto al final del listado de abogados */
  .list-help{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
       margin-top:28px;padding:24px 28px;border:1px solid var(--line-soft);border-radius:16px;
       background:var(--bg-warm)}
  .list-help-tx{display:flex;flex-direction:column;gap:4px;min-width:220px;flex:1}
  .list-help-tx b{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  .list-help-tx span{font-size:14px;color:var(--ink-mute);line-height:1.5}
  .list-help-btn{flex:none;height:46px;padding:0 22px;font-size:14.5px;border-radius:11px;gap:9px}
  .list-help-btn svg{width:16px;height:16px}
  /* Contenido de las páginas generadas por build.js (visible antes de que
     arranque el JavaScript, y para quien lo tenga desactivado) */
  .listing-intro{font-size:15.5px;color:var(--ink-soft);line-height:1.6;max-width:70ch;margin:-6px 0 26px}
  .seo-links{margin-top:30px;padding-top:24px;border-top:1px solid var(--line-soft)}
  .seo-links h2{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);letter-spacing:-.015em}
  .seo-links ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:9px}
  .seo-links li a{display:inline-flex;font-size:13.5px;font-weight:600;color:var(--ink-soft);
       background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:8px 15px;
       text-decoration:none;line-height:1;transition:border-color .16s,color .16s}
  .seo-links li a:hover{border-color:var(--accent);color:var(--accent-deep)}
  .seo-cta{margin-top:34px;padding:28px;border:1px solid var(--line-soft);border-radius:16px;
       background:var(--bg-warm);text-align:center}
  .seo-cta h2{font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
  .seo-cta p{font-size:14.5px;color:var(--ink-mute);margin:8px 0 18px;line-height:1.55}

  /* ---------- Modo demostración (DEMO_MODE en js/02-data-model.js) ----------
     Neutro a propósito: advierte sin parecer una alerta de error. */
  /* Una sola nota bajo el grupo de fichas, en vez de una etiqueta por tarjeta:
     así no depende de lo largo que sea cada nombre. Va debajo porque encima
     abría el bloque sin encabezado que la sostuviera y pesaba demasiado. */
  .demo-lista{font-size:13px;line-height:1.5;color:var(--ink-mute);margin:18px 0 0}
  /* En la portada la nota va debajo de las tres fichas, que se ven de una vez.
     En los listados largos iría demasiado tarde, así que ahí abre el grupo,
     entre los filtros y la primera ficha. */
  .demo-lista-arriba{margin:0 0 18px}
  /* Portada con el directorio todavía vacío: donde van las fichas, el aviso de
     que estamos incorporando profesionales y la llamada a darse de alta. */
  .home-soon{max-width:660px;margin:0 auto;text-align:center;padding:38px 28px;
       border:1px solid var(--line-soft);border-radius:20px;background:var(--bg-warm)}
  .home-soon h2{font-family:var(--serif);font-size:clamp(21px,2.6vw,27px);font-weight:600;
       letter-spacing:-.02em;line-height:1.2;color:var(--ink)}
  .home-soon p{font-size:15px;line-height:1.6;color:var(--ink-soft);margin:14px 0 0}
  /* Una sola acción: el enlace secundario que había debajo se retiró. */
  .home-soon-acts{display:flex;justify-content:center;margin-top:24px}
  @media(max-width:640px){
    .home-soon{padding:28px 20px;border-radius:16px}
    .home-soon p{font-size:14.5px}
    .home-soon-acts .btn{width:100%}
  }

  /* Aviso dentro del alta: es el único formulario que envía de verdad estando
     en la demostración, y conviene que se note. */
  .reg-note-demo{border-color:var(--accent-soft);background:var(--accent-tint)}
  .reg-note-demo span{color:var(--accent-deep)}
  .reg-note-demo svg{color:var(--accent)}

  /* Barra del modo demostración (?demo=1): visible en cuanto se entra, pero sin
     competir con el contenido. Va bajo la cabecera y se va con el scroll. */
  .demo-bar{background:var(--bg-warm);border-bottom:1px solid var(--line-soft);
       color:var(--ink-mute);font-size:13px;line-height:1.5;text-align:center;
       padding:9px 20px}
  @media(max-width:640px){ .demo-bar{font-size:12.5px;text-align:left;padding:9px 20px} }
  /* ---------- Avatar de iniciales (fichas sin foto) ----------
     Ocupa el hueco entero del contenedor, así que hereda su forma y sus
     proporciones en cada contexto; solo cambia el tamaño de la letra. */
  .avatar-ini{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
       background:var(--accent-soft);color:var(--accent);
       font-family:var(--serif);font-weight:600;letter-spacing:.03em;line-height:1;
       user-select:none}
  /* Cada hueco tiene un tamaño muy distinto —la foto de la ficha es cuatro veces
     la miniatura del listado en móvil—, así que la letra va por contexto,
     alrededor del 30% del lado corto de la caja. */
  .lcardg-photo  .avatar-ini{font-size:80px}
  .lcard-photo   .avatar-ini{font-size:66px}
  .profile-photo .avatar-ini{font-size:88px}
  .flaw-photo    .avatar-ini{font-size:46px}
  @media(max-width:640px){
    .lcard-photo   .avatar-ini{font-size:26px}   /* miniatura pequeña */
    .profile-photo .avatar-ini{font-size:78px}
    .flaw-photo    .avatar-ini{font-size:58px}
  }


  /* ---------- Cabecera generada de los artículos sin imagen propia ----------
     Rellena el mismo hueco que la fotografía en cada sitio, así que hereda la
     forma del contenedor; solo cambia el tamaño del icono. */
  .art-cover-gen{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
       background:var(--accent-soft);color:var(--accent)}
  .art-cover-gen svg{width:38%;height:auto;stroke-width:1.5}   /* el tamaño real lo fija cada contexto */
  .news-card-img .art-cover-gen svg{width:74px}
  .article-cover .art-cover-gen svg{width:150px}
  .spec-guide-ph .art-cover-gen svg{width:30px;stroke-width:1.7}
  @media(max-width:640px){
    .news-card-img .art-cover-gen svg{width:64px}
    .article-cover .art-cover-gen svg{width:96px}
    .spec-guide-ph .art-cover-gen svg{width:26px}
  }

  /* Contexto propio de las páginas de isla + especialidad que genera build.js:
     qué se resuelve en esa especialidad, qué cambia por la isla y qué hay
     dentro de las guías. */
  .spec-context{margin-top:34px;padding:26px 28px;border:1px solid var(--line-soft);
       border-radius:16px;background:var(--paper)}
  .spec-context h2{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
  .spec-context > p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:12px 0 0;max-width:70ch}
  .spec-context h3{font-size:15.5px;font-weight:700;color:var(--ink);margin:24px 0 0;letter-spacing:-.01em}
  .spec-context ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
  .spec-context li{position:relative;padding-left:18px;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
  .spec-context li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
       border-radius:50%;background:var(--accent-soft)}
  .spec-context-more{margin:14px 0 0}
  .spec-context-more a{font-size:14.5px;font-weight:700;color:var(--accent);text-decoration:none}
  .spec-context-more a:hover{color:var(--accent-deep);text-decoration:underline;text-underline-offset:3px}
  @media(max-width:640px){ .spec-context{padding:20px 18px;margin-top:26px} }

  /* Guías de la especialidad dentro del listado (enlaces internos a /actualidad) */
  .spec-guides{margin-top:34px;padding:26px 28px;border:1px solid var(--line-soft);
       border-radius:16px;background:var(--bg-warm)}
  .spec-guides h2{font-family:var(--serif);font-size:20px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
  .spec-guides ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
  .spec-guides li{display:flex;align-items:flex-start;gap:14px}
  .spec-guide-ph{flex:none;width:64px;height:64px;border-radius:12px;overflow:hidden;
       background:var(--bg-warm);display:block}
  .spec-guide-ph img{width:100%;height:100%;object-fit:cover;display:block}
  .spec-guide-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
  .spec-guides li a{font-size:15.5px;font-weight:700;color:var(--accent);text-decoration:none;letter-spacing:-.01em}
  .spec-guides li a:hover{color:var(--accent-deep);text-decoration:underline;text-underline-offset:3px}
  .spec-guides li span span,.spec-guide-tx > span{font-size:13.5px;color:var(--ink-mute);line-height:1.55}
  @media(max-width:640px){
    .spec-guides{padding:20px 18px;margin-top:26px}
    .spec-guide-ph{width:52px;height:52px;border-radius:10px}
  }

  .empty{text-align:center;padding:60px 20px;color:var(--ink-mute)}
  .empty-cta{margin-top:20px}
  .empty .serif{font-size:26px;color:var(--ink-soft);margin-bottom:8px;display:block}
  .empty-actions{margin-top:22px;display:flex;flex-direction:column;align-items:center;gap:14px}
  .empty-actions .btn svg{width:17px;height:17px}
  .empty-alt{font-size:13.5px;color:var(--ink-mute);cursor:pointer;text-decoration:underline;
       text-underline-offset:3px;transition:color .18s}
  .empty-alt:hover{color:var(--accent)}

  /* ---------- LAWYER PROFILE ---------- */
  .profile-top{display:grid;grid-template-columns:290px 1fr;gap:52px;padding:20px 0 6px;align-items:center}
  .profile-photo{border-radius:18px;overflow:hidden;background:var(--bg-warm);box-shadow:var(--shadow-lg);border:1px solid var(--line-soft);aspect-ratio:1/1.15}
  .profile-photo img{width:100%;height:100%;object-fit:cover}
  .profile-main .badge-role{margin-bottom:20px}
  .profile-main h1{font-family:var(--serif);font-size:clamp(28px,3.4vw,38px);font-weight:600;line-height:1.04;letter-spacing:-.025em}
  .profile-main .subtitle{font-size:18px;color:var(--ink-soft);margin-top:12px;font-weight:500;line-height:1.4}
  .prof-loc{display:flex;align-items:center;gap:8px;color:var(--ink-soft);font-weight:600;font-size:15.5px;margin-top:16px}
  .prof-loc svg{width:18px;height:18px;color:var(--accent);flex:none}
  .firm-card{background:var(--bg-warm);border:1px solid var(--line-soft);border-radius:14px;padding:16px 18px;
       margin:30px 0 26px;display:flex;align-items:center;gap:18px;max-width:480px;
       cursor:pointer;transition:transform .25s, box-shadow .25s, border-color .25s, background .25s}
  .firm-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--line);background:var(--paper)}
  .firm-card .fb{width:78px;height:62px;border-radius:9px;display:grid;place-items:center;flex:none;border:1px solid var(--line-soft)}
  .firm-card .fmeta .nm{font-family:var(--serif);font-size:17px;font-weight:600;line-height:1.15}
  .firm-card .fmeta .row{display:flex;align-items:center;gap:14px;margin-top:7px;flex-wrap:wrap}
  .firm-card .fmeta .row .loc{font-size:13px;color:var(--ink-mute);display:flex;align-items:center;gap:6px}
  .firm-card .fmeta .row .loc svg{width:14px;height:14px}
  .firm-card .arrow{margin-left:auto;color:var(--ink-mute);flex:none;transition:transform .25s, color .25s}
  .firm-card:hover .arrow{color:var(--accent);transform:translateX(3px)}
  .firm-card .arrow svg{width:18px;height:18px}
  .rating-row{display:flex;align-items:center;gap:14px;margin-bottom:26px;flex-wrap:wrap}
  .rating-row .stars .num{font-size:17px;font-weight:700}
  .rating-row .op{font-size:13.5px;color:var(--ink-mute)}
  .rating-row .sep{width:3px;height:3px;border-radius:50%;background:var(--ink-mute);opacity:.5}
  .rating-row .seeall{font-size:13.5px;font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:6px;transition:gap .2s}
  .rating-row .seeall:hover{gap:10px}
  .contact-acts{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:8px;max-width:480px}
  .contact-icons{display:flex;gap:30px}
  .cicon{display:inline-flex;flex-direction:column;align-items:center;gap:6px;background:none;border:none;cursor:pointer;padding:0}
  .cicon-c{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);background:#fff;
       display:flex;align-items:center;justify-content:center;color:var(--accent);transition:.15s}
  .cicon-c svg{width:20px;height:20px}
  .cicon:hover .cicon-c{border-color:var(--accent);background:var(--accent-soft)}
  .cicon-l{font-size:11.5px;font-weight:600;color:var(--ink-soft)}
  .cicon-wa .cicon-c{color:#25D366}
  .cicon-wa .cicon-c svg{width:23px;height:23px}
  .cicon-wa:hover .cicon-c{border-color:#25D366;background:#e9faf0}
  .profile-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px}
  .profile-links a{display:inline-flex;align-items:center;gap:6px;color:var(--accent);
       font-weight:600;font-size:14px;text-decoration:none}
  .profile-links a:hover{text-decoration:underline}
  .profile-links a svg{width:15px;height:15px}
  /* Aviso de cookies */
  .cookie-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;
       display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;
       max-width:920px;margin:0 auto;background:#fff;border:1px solid var(--line);
       box-shadow:0 12px 40px -12px rgba(40,30,15,.28);border-radius:16px;padding:16px 20px}
  .cookie-tx{font-size:13.5px;line-height:1.5;color:var(--ink-soft);flex:1;min-width:240px}
  .cookie-tx a{color:var(--accent)}
  .cookie-acts{display:flex;gap:10px;flex-shrink:0}
  .cookie-btn{font-size:14px;font-weight:600;border-radius:999px;padding:10px 22px;cursor:pointer;border:1px solid transparent}
  .cookie-reject{background:#fff;border-color:var(--line);color:var(--ink-soft)}
  .cookie-reject:hover{border-color:var(--ink-soft)}
  .cookie-accept{background:var(--accent);color:#fff}
  .cookie-accept:hover{background:var(--accent-deep)}
  @media(max-width:560px){ .cookie-bar{flex-direction:column;align-items:stretch} .cookie-acts{justify-content:flex-end} }
  .contact-acts .btn{flex:1;min-width:180px;height:54px;font-size:15.5px;border-radius:12px}

  /* Tabs */
  .tabs{display:flex;gap:44px;border-bottom:1px solid var(--line-soft);margin:46px 0 0;overflow-x:auto}
  .tab{font-size:14.5px;font-weight:600;color:var(--ink-mute);padding:0 0 14px;position:relative;white-space:nowrap;transition:color .2s;letter-spacing:-.005em}
  .tab:hover{color:var(--ink)}
  .tab.active{color:var(--ink)}
  .tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--ink);border-radius:2px}
  .tab .t-short{display:none}
  .tab:hover{color:var(--ink)}
  .tab-panel{display:none;padding:44px 0 8px}
  .tab-panel.active{display:block;animation:fade .4s ease both}
  .tab-panel h2{font-family:var(--serif);font-size:25px;font-weight:600;margin-bottom:22px;letter-spacing:-.02em}
  .tab-panel p{font-size:16px;color:var(--ink-soft);max-width:70ch;margin-bottom:16px;line-height:1.65}

  .facts{display:flex;gap:50px;margin-top:30px;padding-top:30px;border-top:1px solid var(--line);flex-wrap:wrap}
  .fact{display:flex;align-items:center;gap:14px}
  .fact .ic{width:42px;height:42px;border-radius:10px;background:var(--accent-tint);display:grid;place-items:center;color:var(--accent);flex:none}
  .fact .ic svg{width:21px;height:21px}
  .fact .ft{font-size:14.5px;font-weight:700;line-height:1.35}
  .fact .ft span{display:block;font-weight:500;color:var(--ink-mute);font-size:13.5px}

  /* practice cards */
  .grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
  .prac-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;padding:28px 26px;
       display:flex;flex-direction:column;height:100%;
       transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
  .prac-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line)}
  .prac-card .ic{width:40px;height:40px;color:var(--accent);margin-bottom:18px;stroke-width:1.4}
  .prac-card .ic svg{width:100%;height:100%}
  .prac-card h3{font-family:var(--serif);font-size:17px;font-weight:600;margin-bottom:10px}
  .prac-card p{font-size:13.5px;color:var(--ink-mute);margin-bottom:18px;line-height:1.6;flex:1}
  .prac-card .ml{font-size:12.5px;font-weight:600;color:var(--ink-mute);display:inline-flex;align-items:center;gap:6px;transition:gap .2s, color .2s;margin-top:auto}
  .prac-card:hover .ml{gap:10px;color:var(--accent)}
  /* Versión solo informativa (sin CTA): la descripción no necesita reservar hueco para el enlace */
  .prac-card-info p{margin-bottom:0;flex:none}

  /* timeline / formation */
  .timeline{border-left:1px solid var(--line);padding-left:32px;margin-top:12px}
  .tl-item{position:relative;padding-bottom:52px}
  .tl-item:last-child{padding-bottom:4px}
  .tl-item::before{content:"";position:absolute;left:-37px;top:5px;width:9px;height:9px;border-radius:50%;
       background:var(--accent);border:3px solid var(--bg);box-shadow:0 0 0 1px var(--line)}
  .tl-item .yr{font-size:12px;font-weight:700;color:var(--ink-mute);letter-spacing:.06em}
  .tl-item h4{font-family:var(--serif);font-size:17px;font-weight:600;margin:6px 0 5px}
  .tl-item p{font-size:14.5px;color:var(--ink-mute);margin:0;line-height:1.55}

  /* reviews */
  .review{background:var(--paper);border:1px solid var(--line-soft);border-radius:16px;padding:28px 30px;margin-bottom:16px;box-shadow:var(--shadow-sm);transition:border-color .25s, box-shadow .25s}
  .review:hover{border-color:var(--line);box-shadow:var(--shadow-md)}
  .review .rh{display:flex;align-items:center;gap:13px;margin-bottom:18px}
  .review .ava{width:42px;height:42px;border-radius:50%;background:var(--bg-warm);color:var(--ink-soft);
       display:grid;place-items:center;font-weight:700;font-size:14.5px;flex:none;border:1px solid var(--line-soft)}
  .review .who{font-weight:700;font-size:14.5px;line-height:1.2}
  .review .when{font-size:12.5px;color:var(--ink-mute);margin-top:2px}
  .review .rstars{margin-left:auto;opacity:.85}
  .review .rstars svg{width:13px;height:13px}
  .review p{font-size:16px;color:var(--ink);margin:0;line-height:1.65}

  .profile-cta{background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:18px;
       padding:36px 40px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:36px}
  .profile-cta .ic{width:56px;height:56px;border-radius:14px;background:var(--paper);display:grid;place-items:center;color:var(--accent);flex:none}
  .profile-cta .ic svg{width:27px;height:27px}
  .profile-cta .tx{flex:1;min-width:240px}
  .profile-cta h3{font-family:var(--serif);font-size:21px;font-weight:600;margin-bottom:6px;letter-spacing:-.01em}
  .profile-cta p{font-size:15px;color:var(--ink-soft);line-height:1.5}
  .profile-cta .btn{height:54px;font-size:15.5px;border-radius:12px;flex:none;box-shadow:0 4px 14px rgba(207,64,48,.22)}
  .profile-cta .btn:hover{box-shadow:0 8px 22px rgba(207,64,48,.3)}
  /* Desktop: CTA inferior algo menos alto para que la sección respire más */
  @media(min-width:641px){ .profile-cta{padding:26px 40px} }
  /* microtexto discreto de ayuda bajo el CTA del perfil */
  .profile-help{text-align:center;margin-top:16px;font-size:13.5px;color:var(--ink-mute);line-height:1.5}
  .profile-help a{color:var(--accent);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
  .profile-help a:hover{color:var(--accent-deep)}

  /* CTA secundario compacto (aparece dentro de los paneles, sube la conversión) */
  .cta-mini{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
       background:var(--bg-warm);border:1px solid var(--line-soft);border-radius:14px;
       padding:16px 20px;margin-top:8px}
  .cta-mini-tx{flex:1;min-width:200px;display:flex;flex-direction:column;gap:3px}
  .cta-mini-tx strong{font-size:15.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  .cta-mini-tx span{font-size:13.5px;color:var(--ink-mute)}
  .cta-mini .btn{flex:none;height:44px;font-size:14.5px;border-radius:11px}

  /* ---------- FIRM PROFILE ---------- */
  .firm-hero{display:grid;grid-template-columns:230px 1fr auto;gap:34px;padding:18px 0 8px;align-items:start}
  .firm-hero .fhlogo{width:190px;height:158px;border-radius:16px;display:grid;place-items:center;
       border:1px solid var(--line-soft);box-shadow:var(--shadow-md)}
  .firm-hero .fhmain h1{font-family:var(--serif);font-size:clamp(28px,3.4vw,38px);font-weight:700;line-height:1.05;letter-spacing:-.025em;margin-top:12px}
  .firm-hero .fhmain .tagline{font-size:15.5px;color:var(--ink-soft);max-width:46ch;margin-top:14px;line-height:1.62}
  .firm-hero .meta-row{display:flex;align-items:center;gap:26px;margin-top:18px;flex-wrap:wrap}
  .firm-hero .meta-row .m{font-size:14px;color:var(--ink-soft);display:flex;align-items:center;gap:7px}
  .firm-hero .meta-row .m svg{width:16px;height:16px;color:var(--accent)}
  .firm-hero .fhacts{display:flex;flex-direction:column;gap:10px;width:262px}
  .firm-hero .fhacts .fh-main-cta{width:100%;height:52px;font-size:15px}
  .firm-hero .fhacts .fh-sec-row{display:flex;gap:10px}
  .firm-hero .fhacts .fh-sec-row .btn{flex:1;height:44px;font-size:14px;padding:0 12px}

  .firm-body{display:grid;grid-template-columns:1fr 380px;gap:44px;margin-top:56px}
  .firm-about h2{font-family:var(--serif);font-size:24px;font-weight:600;margin-bottom:16px}
  .firm-about p{font-size:15.5px;color:var(--ink-soft);margin-bottom:16px;line-height:1.65}
  .firm-about-text p:last-child{margin-bottom:0}
  /* "Leer más": solo aparece en móvil cuando el texto se recorta */
  .read-more{display:none;align-items:center;gap:6px;margin-top:12px;background:none;border:none;
       padding:0;font-size:14px;font-weight:700;color:var(--accent);cursor:pointer}
  .read-more svg{width:15px;height:15px;transition:transform .25s}
  .read-more.open svg{transform:rotate(180deg)}
  .firm-stats{display:flex;gap:56px;margin-top:30px;padding-top:30px;border-top:1px solid var(--line);flex-wrap:wrap}
  /* en desktop se mantienen las métricas originales; la variante creíble es solo para móvil */
  .firm-stats-credible{display:none}
  .firm-stat{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
  .firm-stat .ic{display:none}
  .firm-stat .big{font-size:42px;font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--ink)}
  .firm-stat .lbl{font-size:14px;color:var(--ink-mute);font-weight:600;margin-top:2px}

  .spec-box{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px 30px;box-shadow:var(--shadow-sm);height:fit-content}
  .spec-box h3{font-family:var(--serif);font-size:19px;font-weight:600;margin-bottom:18px}
  .spec-box ul{list-style:none}
  .spec-box li{display:flex;align-items:center;gap:11px;font-size:15px;color:var(--ink-soft);padding:10px 0;font-weight:500}
  .spec-box li.spec-extra{display:none}
  .spec-box ul.show-all li.spec-extra{display:flex}
  .spec-box li svg{width:17px;height:17px;color:var(--accent);flex:none}
  /* === Checks modernos: badge circular coral suave, coherente en toda la web === */
  .plan-bens li svg,
  .regplan-bens li svg,
  .spec-box li svg,
  .spec-stats .st svg{
    width:20px;height:20px;padding:4px;border-radius:50%;box-sizing:border-box;
    background:var(--accent-soft);color:var(--accent-deep);flex:none;margin-top:0}
  .spec-box li{align-items:center}
  .plan-bens li,.regplan-bens li{align-items:center}
  .spec-box .more{margin-top:14px;font-size:14px;font-weight:700;color:var(--accent);display:inline-flex;align-items:center;gap:7px}
  /* botón "+N más" de áreas: solo se usa en móvil (en desktop se ven todas) */
  .spec-more-btn{display:none}

  .firm-lawyers{margin-top:56px}
  /* Mostramos solo 3 abogados; el resto se revela con el botón "Ver más" (en todos los tamaños) */
  .lcard-list:not(.show-all) .firm-lawyer-extra{display:none}
  .firm-more-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
       margin-top:10px;background:var(--paper);border:1px solid var(--line);border-radius:14px;
       padding:15px 18px;font-size:15px;font-weight:700;color:var(--ink-soft);cursor:pointer;
       transition:background .2s, border-color .2s, color .2s}
  .firm-more-btn:hover{background:var(--bg-warm);border-color:var(--accent-soft);color:var(--ink)}
  .firm-more-btn svg{width:16px;height:16px;color:var(--accent);transition:transform .25s}
  .firm-more-btn.open svg{transform:rotate(180deg)}
  .firm-lawyers .head-row h2{font-size:32px}

  /* Card premium de abogado del despacho */
  .flaw{background:var(--paper);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden;
       cursor:pointer;margin-bottom:16px;box-shadow:var(--shadow-sm);
       transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
       display:grid;grid-template-columns:150px 1fr auto;align-items:center}
  .flaw:hover{transform:translateY(-2px);box-shadow:0 12px 30px -16px rgba(40,30,15,.24);border-color:var(--accent-soft)}
  .flaw-photo{align-self:stretch;background:var(--bg-warm);overflow:hidden;min-height:168px}
  .flaw-photo img{width:100%;height:100%;object-fit:cover;object-position:center 32%;display:block;transition:transform .5s}
  .flaw:hover .flaw-photo img{transform:scale(1.04)}
  .flaw-body{padding:20px 26px;min-width:0}
  .flaw-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .flaw-name{font-family:var(--serif);font-size:25px;font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--ink);margin:0}
  .flaw-rating{display:inline-flex;align-items:center;gap:5px;font-size:13.5px;color:var(--ink-soft);font-weight:600}
  .flaw-rating svg{width:15px;height:15px;color:#e0a92e;flex:none}
  .flaw-rating b{font-weight:800;color:var(--ink)}
  .flaw-rating span{color:var(--ink-mute);font-weight:500}
  .flaw-role{font-size:14px;color:var(--ink-mute);font-weight:600;margin-top:6px;line-height:1.35}
  .flaw-exp{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--ink-mute);margin-top:9px}
  .flaw-exp svg{width:15px;height:15px;color:var(--ink-mute);flex:none;stroke-width:1.8}
  .flaw-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
  .flaw-cta{align-self:center;justify-self:end;display:inline-flex;align-items:center;gap:7px;height:46px;
       padding:0 26px;margin:0 24px;font-size:14.5px;font-weight:700;border-radius:12px;
       background:var(--ink);color:#fff;white-space:nowrap;box-shadow:0 1px 2px rgba(20,18,15,.18);
       transition:background .2s, transform .2s, box-shadow .2s}
  .flaw-cta svg{width:15px;height:15px;transition:transform .2s}
  .flaw:hover .flaw-cta{background:var(--accent);box-shadow:0 5px 16px rgba(231,98,79,.26)}
  .flaw:hover .flaw-cta svg{transform:translateX(3px)}
  .grid-4-l{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
  .mini-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:14px;overflow:hidden;
       box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .28s, box-shadow .28s}
  .mini-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
  .mini-card .mph{height:175px;overflow:hidden;background:var(--bg-warm)}
  .mini-card .mph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
  .mini-card:hover .mph img{transform:scale(1.06)}
  .mini-card .mbd{padding:18px 18px 20px}
  .mini-card h3{font-family:var(--serif);font-size:16px;font-weight:600;line-height:1.18}
  .mini-card .mrole{font-size:13px;color:var(--ink-mute);margin:2px 0 11px}
  .mini-card .mtag{margin-bottom:12px}
  .mini-card .mdesc{font-size:13px;color:var(--ink-soft);line-height:1.5;margin-bottom:13px}
  .mini-card .vp{font-size:13.5px;font-weight:700;color:var(--accent);display:inline-flex;align-items:center;gap:6px;transition:gap .2s}
  .mini-card:hover .vp{gap:10px}

  .firm-office{margin-top:56px}
  .office-grid{display:grid;grid-template-columns:0.85fr 1.25fr;gap:28px;margin-top:24px}
  .office-info{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:32px 32px;box-shadow:var(--shadow-sm);align-self:start}
  .office-info .oi{display:flex;align-items:flex-start;gap:15px;margin-bottom:24px}
  .office-info .oi:last-of-type{margin-bottom:0}
  .office-info .oi .ic{color:var(--accent);flex:none;margin-top:1px;width:40px;height:40px;border-radius:11px;
       background:var(--accent-tint);display:grid;place-items:center}
  .office-info .oi .ic svg{width:19px;height:19px}
  .office-info .oi .ot{font-size:14.5px;color:var(--ink-soft);line-height:1.6}
  .office-info .oi .ot strong{display:block;color:var(--ink-mute);font-weight:700;margin-bottom:4px;font-size:12px;letter-spacing:.07em;text-transform:uppercase}
  .office-info .howto{margin-top:24px;padding-top:22px;border-top:1px solid var(--line-soft);font-size:14.5px;font-weight:700;color:var(--accent);display:inline-flex;align-items:center;gap:7px}
  .office-map{border-radius:26px;overflow:hidden;border:1px solid var(--line);min-height:440px;position:relative;background:#e8efeb;box-shadow:var(--shadow-md)}
  .office-map-frame{width:100%;height:100%;min-height:440px;border:0;display:block;position:absolute;inset:0}
  .office-map-card{position:absolute;left:16px;bottom:16px;right:auto;max-width:74%;z-index:3;
       background:var(--paper);border:1px solid var(--line-soft);border-radius:14px;padding:13px 16px;
       box-shadow:0 6px 22px -6px rgba(40,30,15,.28)}
  .office-map-card .omc-name{display:flex;align-items:center;gap:7px;font-family:var(--serif);font-size:14.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  .office-map-card .omc-name svg{width:15px;height:15px;color:var(--accent);flex:none}
  .office-map-card .omc-addr{font-size:12.5px;color:var(--ink-mute);margin-top:3px;line-height:1.4}
  .office-map-card .omc-link{display:inline-flex;align-items:center;gap:6px;margin-top:9px;font-size:12.5px;font-weight:700;color:var(--accent);transition:gap .2s}
  .office-map-card .omc-link svg{width:13px;height:13px}
  .office-map-card .omc-link:hover{gap:10px}

  /* ---------- Mobile menu ---------- */
  .mobile-menu{position:fixed;inset:0;background:var(--bg);z-index:200;
       display:flex;flex-direction:column;
       height:100vh;height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;
       overscroll-behavior:contain;
       padding:18px 28px calc(34px + env(safe-area-inset-bottom));
       opacity:0;visibility:hidden;transform:translateY(-10px);
       transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1),visibility .45s}
  .mobile-menu.open{opacity:1;visibility:visible;transform:translateY(0)}
  .mobile-menu .mm-top{position:sticky;top:0;z-index:2;flex:none;
       display:flex;align-items:center;justify-content:space-between;height:64px;
       margin:0 -28px;padding:0 28px;background:var(--bg)}
  .mobile-menu .mm-top .logo img{height:20px}
  .mobile-menu .mm-close{font-size:32px;color:var(--ink-soft);line-height:1;width:44px;height:44px;
       display:flex;align-items:center;justify-content:center;transition:color .2s}
  .mobile-menu .mm-close:hover{color:var(--ink)}
  .mobile-menu nav{display:flex;flex-direction:column;gap:2px;margin-top:24px}
  .mobile-menu nav a{font-family:var(--serif);font-size:23px;font-weight:600;color:var(--ink);
       padding:18px 0;border-bottom:1px solid var(--line-soft);cursor:pointer;
       opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s cubic-bezier(.16,1,.3,1),color .2s}
  .mobile-menu nav a:hover{color:var(--accent)}
  /* Etiqueta de sección "Ayuda" en el menú móvil */
  .mobile-menu nav .mm-section-label{font-family:var(--sans);font-size:11.5px;font-weight:700;
       letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);
       padding:22px 0 10px;margin-top:6px;border-bottom:none;
       opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s cubic-bezier(.16,1,.3,1)}
  .mobile-menu.open nav .mm-section-label{opacity:1;transform:translateY(0)}
  /* Sub-items dentro de la sección Ayuda: tipo más pequeña, peso menor */
  .mobile-menu nav a.mm-sub{font-family:var(--sans);font-size:16px;font-weight:600;
       color:var(--ink-soft);padding:14px 0}
  .mobile-menu nav a.mm-sub:hover{color:var(--accent)}
  .mobile-menu.open nav a{opacity:1;transform:translateY(0)}
  .mobile-menu.open nav a:nth-child(1){transition-delay:.08s}
  .mobile-menu.open nav a:nth-child(2){transition-delay:.13s}
  .mobile-menu.open nav a:nth-child(3){transition-delay:.18s}
  .mobile-menu.open nav .mm-section-label{transition-delay:.22s}
  .mobile-menu.open nav a:nth-child(5){transition-delay:.26s}
  .mobile-menu.open nav a:nth-child(6){transition-delay:.30s}
  .mobile-menu.open nav a:nth-child(7){transition-delay:.34s}
  .mobile-menu.open nav a:nth-child(8){transition-delay:.38s}
  .mobile-menu.open nav a:nth-child(9){transition-delay:.42s}
  .mobile-menu .mm-cta{margin-top:32px;
       opacity:0;transform:translateY(12px);transition:opacity .5s ease .36s,transform .5s cubic-bezier(.16,1,.3,1) .36s}
  .mobile-menu.open .mm-cta{opacity:1;transform:translateY(0)}
  .mobile-menu .mm-cta .btn{height:54px;font-size:15.5px}

  /* ============================================================
     RESPONSIVE  ·  mobile-first refinement (tablet / phone / small)
     ============================================================ */

  /* —— Tablet & small laptop —— */
  @media(max-width:1024px){
    :root{--maxw:960px}
    .grid-3{grid-template-columns:1fr 1fr}
    .grid-3 .card-feat:nth-child(3){display:none} /* keep a clean 2-up row */
    .spec-grid{grid-template-columns:repeat(3,1fr)}
  }

  /* —— Below 960: nav collapses to burger, hero stacks —— */
  @media(max-width:960px){
    .nav-links{display:none}
    .burger{display:flex}
    .nav{height:66px}
    /* Grid cards (home Recomendados): 2 por fila en tablet */
    .lcardg-list{grid-template-columns:repeat(2,1fr);gap:18px}
    /* Hero limpio (sin foto): apilar columnas y reducir altura vertical */
    .hero{padding:60px 0 64px}
    .hero-top{grid-template-columns:1fr;gap:32px}
    .hero-left{max-width:none}
    .trust-card{max-width:520px}
    .search-card{margin:36px auto 0}
    .spec-grid{grid-template-columns:repeat(2,1fr)}
    .news-hero{grid-template-columns:1fr;gap:30px;padding:40px 0 44px}
    .news-hero-tx{max-width:100%;padding-top:0}
    .news-hero-img{order:-1;aspect-ratio:16/9;max-height:340px}
    /* Register — tablet */
    .reg-card{grid-template-columns:1fr;max-width:760px}
    .reg-side{border-right:none;border-bottom:1px solid var(--line)}
    .reg-side-top{padding:34px 34px 28px}
    .reg-value{font-size:24px;max-width:none}
    .reg-value-sub{max-width:46ch}
    .reg-benefits{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px}
    .reg-main{padding:34px 36px 34px}
    .grid-3,.grid-4,.grid-4-l{grid-template-columns:1fr 1fr}
    .grid-3 .card-feat:nth-child(3){display:block}
    .profile-top{grid-template-columns:1fr;gap:24px;padding-top:14px}
    .profile-photo{max-width:280px}
    .firm-hero{grid-template-columns:1fr}
    .firm-hero .fhacts{width:100%;flex-direction:row;flex-wrap:wrap}
    .firm-hero .fhacts .btn{flex:1;min-width:150px}
    .firm-body{grid-template-columns:1fr}
    .office-grid{grid-template-columns:1fr}
    .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
    .section{padding:60px 0}
    /* Va después de .section porque tienen la misma especificidad: sin esto,
       la sección de fichas recuperaría aquí el aire de un encabezado que no
       existe. */
    .section-featured{padding-top:34px}
  }

  /* —— Phones —— */
  @media(max-width:640px){
    .wrap{padding:0 20px}
    .section{padding:40px 0}
    /* Cards verticales en móvil: 1 columna, foto algo menos alta, padding compacto */
    .lcardg-list{grid-template-columns:1fr;gap:14px}
    .lcardg-photo{aspect-ratio:4/3}
    .lcardg-name{font-size:19px}
    .lcardg-body{padding:18px 18px 18px}
    .nav{height:54px}
    /* header móvil más centrado en la franja superior (lejos de la barra de estado) */
    #hdr{padding-top:calc(18px + env(safe-area-inset-top, 0px));padding-bottom:6px}
    .nav-logo .logo{font-size:18px}
    .nav-logo .logo img{height:20px}
    .spec-grid{grid-template-columns:repeat(2,1fr);gap:12px}
    .spec-head{padding:8px 0 22px}
    .spec-head .spec-sub{font-size:15px}
    .spec-stats{gap:9px 18px;margin-top:18px}
    .spec-stats .st{font-size:13px}
    .spec-cat + .spec-cat{margin-top:32px}
    .spec-cat-head h2{font-size:18px}
    /* cards de especialidad más compactas en móvil */
    .spec-card{padding:18px 16px 16px;border-radius:16px;border-color:var(--line-soft);
               box-shadow:0 2px 12px rgba(40,30,15,.04)}
    .spec-card .spec-ic{width:46px;height:46px;border-radius:14px;margin-bottom:13px}
    .spec-card .spec-ic svg{width:24px;height:24px}
    .spec-card h3{font-size:16.5px;margin-bottom:5px;line-height:1.2}
    .spec-card p{font-size:13px;line-height:1.45;margin-bottom:14px;
       display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
    .spec-foot{padding-top:12px}
    .spec-count b{font-size:16px}
    .spec-count,.spec-go{font-size:12px}
    .spec-help{padding:34px 22px;border-radius:20px;margin-top:36px}
    .spec-help h2{font-size:22px}
    .spec-help p{font-size:15px}
    .spec-help .btn{width:100%}
    /* hero centrado en móvil */
    .hero{padding:16px 0 28px}
    .hero h1,.hero-title{font-size:clamp(23px,6.55vw,35px);line-height:1.4;letter-spacing:-.03em}
    .hero-title .ln1{white-space:nowrap}
    /* en móvil el titular cae en 3 líneas: misma separación entre todas */
    .hero-title .tail{display:block;margin-top:.04em}
    .hero h1 .ln1,.hero h1 .ln2{white-space:normal}
    .hero p.sub,.hero .sub{white-space:normal}
    .hero p.sub,.hero .sub{font-size:15px;max-width:34ch;margin:22px auto 0;line-height:1.5}
    .hc-trust{margin-top:24px;gap:8px 18px;font-size:12px}
    /* cápsula buscador: apilada */
    .search-card{padding:12px;margin:30px auto 0;border-radius:22px;max-width:520px}
    .search-row{flex-direction:column;align-items:stretch;gap:8px}
    .search-row .field{min-width:0;width:100%}
    .search-div{display:none}
    .search-card select{height:54px;border:1px solid var(--line);background:var(--paper);border-radius:14px;padding:0 40px 0 44px}
    .search-card select:hover,.search-card select:focus{background:var(--paper)}
    .search-card .btn{width:100%;height:54px;font-size:15.5px;margin-top:2px}
    /* chips: scroll horizontal (en móvil se desliza con el dedo, sin flechas) */
    .hero-chips-head{margin-top:20px;padding:0 2px}
    .hero-chips-wrap{margin-top:22px;max-width:none}
    .hero-chips-nav{display:none}
    .hero-chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;gap:8px;
       padding:0 18px 4px;margin:0 -18px;scrollbar-width:none;-webkit-overflow-scrolling:touch;
       -webkit-mask-image:none;mask-image:none}
    .hero-chips::-webkit-scrollbar{display:none}
    .hero-chips-lbl{display:none}
    .hero-chip{flex:none;white-space:nowrap}
    /* Recomendados: más aire respecto al buscador y enlace 'ver todos' abajo */
    .section-featured{padding-top:24px}
    .home-why{padding-top:34px}
    .home-why-title{font-size:21px;margin-bottom:18px}
    .home-why-grid{flex-direction:column;gap:9px}
    .why-item{width:100%;font-size:13.5px;padding:12px 14px}
    .featured-more{margin-top:22px}
    .featured-more .btn{width:100%;max-width:340px}
    .grid-3,.grid-4,.grid-4-l{grid-template-columns:1fr;gap:16px}
    /* featured cards (Recomendados) MÓVIL: avatar circular, misma línea que el listado */
    .card-feat{border-radius:18px;display:block;padding:18px 18px 20px}
    .card-feat .ph{width:82px;height:82px;flex:none;border-radius:50%;overflow:hidden}
    .card-feat .ph img{object-position:center 25%}
    .card-feat .ph .verif-badge{display:none}
    .card-feat .bd{padding:0;display:flex;flex-direction:column}
    /* el nombre se solapa junto al avatar; el resto va a ancho completo */
    .card-feat h3{font-size:18px;line-height:1.2;margin-top:-82px;padding-left:96px;
         min-height:82px;display:flex;align-items:center}
    .card-feat .role{margin-bottom:8px;margin-top:14px}
    .card-feat .loc{margin-bottom:6px}
    .card-feat .firm-line{margin-bottom:14px}
    .card-feat .lcard-cta{width:100%;height:46px;font-size:14.5px;border-radius:11px}
    /* abogados dentro del DESPACHO (mini-card) MÓVIL: avatar circular, misma línea */
    .grid-4-l{grid-template-columns:1fr;gap:14px}
    .mini-card{display:block;border-radius:18px;padding:18px 18px 20px}
    .mini-card .mph{width:82px;height:82px;flex:none;border-radius:50%;overflow:hidden}
    .mini-card .mph img{object-position:center 28%}
    .mini-card .mbd{padding:0;display:flex;flex-direction:column}
    /* el nombre se solapa junto al avatar; el resto va a ancho completo */
    .mini-card h3{font-size:18px;line-height:1.2;margin-top:-82px;padding-left:96px;
         min-height:82px;display:flex;align-items:center}
    .mini-card .mrole{color:var(--ink-soft);margin:14px 0 11px}
    .mini-card .mtag{margin-bottom:12px}
    .mini-card .mdesc{margin-bottom:14px}
    .mini-card .vp{font-size:14.5px}
    .head-row{flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:20px}
    .head-row h2{font-size:27px;letter-spacing:-.02em}
    /* filter bar stacks into full-width controls */
    .filter-bar{flex-direction:column;align-items:stretch;gap:14px;padding:16px 16px}
    .filter-bar .fg{flex-direction:column;align-items:stretch;gap:10px}
    .filter-bar .fg label{margin-bottom:-2px}
    .filter-bar .sw{width:100%}
    .filter-bar select{width:100%;min-width:0;height:48px}
    /* FILTROS MÓVIL — compactos y premium (estilo Airbnb/Stripe):
       isla + especialidad en 2 columnas, sin etiquetas redundantes, controles más bajos.
       Objetivo: mostrar más abogados above the fold. */
    .filter-bar{position:sticky;top:54px;z-index:40;display:flex;flex-direction:column;align-items:stretch;
       gap:8px;padding:10px;margin-bottom:18px;border-radius:14px;border-color:var(--line-soft);
       box-shadow:0 1px 10px rgba(40,30,15,.04);
       background:rgba(250,247,242,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
    /* las etiquetas en mayúsculas se ocultan: los propios selects ya describen el filtro */
    .filter-bar .fg label{display:none}
    /* primer grupo (isla + especialidad) en rejilla de 2 columnas */
    .filter-bar .fg:first-child{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
    /* "Ordenar por" se oculta en móvil: aún no hay datos suficientes que lo justifiquen */
    .filter-bar .fg:nth-child(2){display:none}
    .filter-bar .fg .sw{width:100%}
    .filter-bar select{width:100%;min-width:0;height:42px;font-size:13px;padding:0 27px 0 11px;
       border-radius:10px;background:var(--paper)}
    .filter-bar .fg .sw .chev{right:10px}
    /* ===== Listing cards MÓVIL — misma jerarquía que desktop =====
       Foto circular arriba a la izquierda con el nombre al lado; el resto de info
       (despacho, ubicación, pills, modalidad, botón) ocupa todo el ancho
       debajo. Botón a ancho completo. */
    .lcard{grid-template-columns:76px 1fr auto;grid-template-areas:"photo name chev" "body body chev";
         padding:16px 14px 16px;border-radius:14px;margin-bottom:12px;column-gap:14px;row-gap:0;overflow:hidden}
    .lcard-photo{width:76px;height:76px;border-radius:50%;overflow:hidden;align-self:start;background:var(--bg-warm);margin:0}
    .lcard-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%;border-radius:50%}
    /* encuadre uniforme: misma línea de ojos en todas las fotos */
    .lcard-photo img[data-face="ana"]{object-position:center 22%}
    .lcard-photo img[data-face="gerardo"]{object-position:center 26%}
    .lcard-photo img[data-face="marta"]{object-position:center 22%}
    .lcard-photo img[data-face="javier"]{object-position:center 24%}
    .lcard-photo img[data-face="raquel"]{object-position:center 28%}
    .lcard-photo img[data-face="david"]{object-position:center 24%}
    .lcard-photo img[data-face="carlos"]{object-position:center 22%}
    .lcard-photo img[data-face="paula"]{object-position:center 26%}
    /* badge "Destacado" sobre la foto: se oculta en móvil (foto circular pequeña) */
    .lcard-feat{display:none}
    /* Nombre: alineado verticalmente al centro de la foto */
    .lcard-name{padding:0;align-self:center;font-size:18px;font-weight:700;line-height:1.2}
    /* Body: ocupa todo el ancho debajo del bloque foto+nombre */
    .lcard-body{padding:14px 0 0}
    /* Despacho */
    .lcard-firm{font-size:14px;font-weight:700;color:var(--ink);margin-top:0}
    .lcard-firm.indep{font-size:13.5px}
    /* Ubicación */
    .lcard-loc{font-size:12.5px;color:var(--ink-mute);margin-top:4px}
    .lcard-loc svg{width:12px;height:12px}
    /* Descripción profesional oculta en móvil: prioriza compacidad y "más perfiles por pantalla" */
    .lcard-desc{display:none}
    /* Pills */
    .lcard-pills{margin-top:11px;gap:6px}
    .lc-pill{font-size:11.5px;font-weight:600;padding:2px 10px;border-radius:999px;line-height:1.45;
         background:transparent;border:1px solid rgba(231,98,79,.28);color:var(--accent-deep);letter-spacing:.005em}
    .lc-pill-more{font-size:11.5px;font-weight:600;padding:2px 10px;border-radius:999px;line-height:1.45;
         background:rgba(40,30,15,.03);border:1px solid rgba(40,30,15,.08);color:var(--ink-mute);letter-spacing:.005em}
    /* Modalidad — una sola línea */
    .lcard-trustline{margin-top:13px;gap:8px}
    .lc-verif{font-size:11.5px;gap:5px}
    .lc-verif svg{width:12px;height:12px}
    .lcard-attn{font-size:11.5px;gap:5px}
    .lcard-attn svg{width:12px;height:12px}
    /* CTA móvil: flecha en círculo coral a la derecha; la fila entera es pulsable */
    .lcard-cta{grid-area:chev;align-self:center;justify-self:center;margin:0;width:38px;height:38px;
         min-width:38px;padding:0;border-radius:50%;background:var(--accent-tint);color:var(--accent);
         border:none;box-shadow:none;font-size:0;position:relative;overflow:hidden}
    .lcard-cta svg{position:absolute;top:50%;left:50%;width:18px;height:18px;
         transform:translate(-50%,-50%);display:block}
    .lcard-cta:active{transform:scale(.92)}
    /* About / Sobre nosotros — mobile */
    .ab-hero{grid-template-columns:1fr;gap:32px;padding:36px 0 48px}
    .ab-hero-tx{max-width:100%}
    .ab-hero h1{font-size:clamp(28px,8vw,36px)}
    .ab-rule{margin:22px 0}
    .ab-hero-tx p{max-width:100%;font-size:15.5px}
    .ab-hero-img{order:-1;aspect-ratio:3/2}
    .ab-offer{padding:48px 0}
    .ab-head{margin-bottom:36px}
    .ab-grid{grid-template-columns:1fr;gap:0}
    .ab-feature{text-align:left;display:grid;grid-template-columns:42px 1fr;gap:0 18px;padding:22px 0;
       border-bottom:1px solid var(--line-soft)}
    .ab-feature:last-child{border-bottom:none}
    .ab-feature + .ab-feature::before{display:none}
    .ab-ic{margin:0;width:38px;height:38px;grid-row:span 2}
    .ab-feature h3{margin-bottom:5px;align-self:center}
    .ab-feature p{font-size:14px}
    .ab-local{grid-template-columns:1fr;gap:28px;padding:48px 0}
    .ab-local-tx{max-width:100%}
    .ab-local-img{order:-1;aspect-ratio:16/10}
    .ab-cta{padding:46px 26px;border-radius:20px}
    .ab-cta .ic{width:54px;height:54px;margin-bottom:18px}
    .ab-cta .ic svg{width:26px;height:26px}
    .ab-cta p{font-size:15px}
    .btn-light{width:100%}
    /* News / Actualidad — mobile */
    .news-hero{grid-template-columns:1fr;gap:28px;padding:30px 0 40px}
    .news-hero-tx{max-width:100%}
    .news-hero h1{font-size:clamp(29px,8.5vw,40px)}
    .news-hero-tx p{max-width:100%;font-size:16px}
    .news-hero-img{order:-1;aspect-ratio:16/10}
    .news-filters{flex-direction:column;align-items:stretch;gap:12px;margin-bottom:20px}
    .news-search{width:100%;min-width:0;height:50px}
    .news-chips{gap:8px;margin-bottom:32px;overflow-x:auto;flex-wrap:nowrap;
       -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
    .news-chips::-webkit-scrollbar{display:none}
    .news-chip{flex:none;white-space:nowrap}
    .news-head-row{margin-bottom:20px;flex-direction:column;align-items:flex-start;gap:6px}
    .news-grid{grid-template-columns:1fr;gap:22px}
    .news-card-body{padding:22px 22px 24px}
    .news-card h3{font-size:20px}
    /* Register — mobile (setup rápido, compacto) */
    .reg{padding:14px 0 0}
    .reg-card{border-radius:16px}
    .reg-side-top{padding:22px 18px 20px}
    .reg-value{font-size:21px}
    .reg-value-sub{font-size:13.5px;margin-top:8px}
    .reg-benefits{grid-template-columns:1fr;gap:13px;margin-top:18px}
    .reg-main{padding:20px 16px 24px}
    .reg-head{margin-bottom:18px}
    .reg-head h1{font-size:22px}
    .reg-head p{font-size:13px;margin-top:4px}
    .reg-modepick{margin-bottom:18px}
    /* Secciones más juntas (refuerza el acordeón) */
    .reg-sec{padding-bottom:0;margin-bottom:12px}
    .reg-sec-title{margin-bottom:16px}
    .reg-sec-title h3{font-size:15.5px}
    .reg-sec-title svg{width:18px;height:18px}
    /* Inputs y campos más bajos y juntos */
    .reg-field{margin-bottom:14px}
    .reg-lbl{margin-bottom:6px;font-size:12px}
    .reg-field input,.reg-field textarea,.reg-select select{height:44px;font-size:14px;border-radius:10px}
    .reg-field textarea{min-height:88px}
    .reg-grid-2,.reg-grid-3{grid-template-columns:1fr;gap:14px}
    .reg-sec .reg-grid-2,.reg-sec .reg-grid-3{margin-bottom:14px}
    .reg-fields{gap:14px}
    .reg-personal{grid-template-columns:1fr;gap:14px}
    /* En móvil el bloque de la foto se pone en fila. Las notas no caben en esa
       fila —salían en columnas de 40px, una palabra por línea—, así que se
       bajan a su propio renglón. */
    .reg-photo{align-items:center;flex-direction:row;flex-wrap:wrap;gap:14px;justify-content:flex-start}
    .reg-lbl-center{width:auto;text-align:left}
    .reg-avatar{width:74px;height:74px;margin-top:0;flex:none}
    .reg-avatar svg{width:20px;height:20px}
    .reg-hint{margin-top:0;flex:0 0 100%}
    .reg-hint-sin-prisa{margin-top:-8px}
    /* Chips compactos (especialidades / islas / idiomas) */
    .reg-chips{gap:6px}
    .reg-chip{font-size:12px;padding:6px 12px}
    .reg-chip-sm{font-size:11.5px;padding:5px 11px}
    .reg-toggle-row{margin-top:12px;padding:11px 13px}
    /* Modalidad de atención compacta */
    .reg-seg{gap:6px}
    .reg-seg-btn{height:50px;flex-direction:column;gap:3px;font-size:12px;padding:0 4px}
    .reg-seg-btn svg{width:15px;height:15px}
    /* Planes y suscripción compactos */
    .reg-plansec{padding-top:18px;margin-bottom:10px}
    .reg-sec-desc{font-size:12.5px;margin:-4px 0 12px}
    .regplans{grid-template-columns:1fr;gap:10px}
    .regplan{padding:14px 14px 15px;border-radius:13px}
    .regplan-radio{top:13px;right:13px;width:20px;height:20px}
    .regplan-name{font-size:16px}
    .regplan-tag{font-size:9px;padding:3px 9px 3px 7px}
    .regplan-tagline{font-size:11.5px}
    .regplan-price{margin:10px 0 2px}
    .regplan-price b{font-size:23px}
    .regplan-badge{font-size:11px;padding:5px 11px;margin-top:8px}
    .regplan-hl{font-size:11.5px;padding:7px 10px;margin-top:9px}
    .regplan-bens-wrap{margin-top:12px;padding-top:11px}
    .regplan-bens{gap:6px}
    .regplan-bens li svg{width:17px;height:17px;padding:3.5px}
    .regplan-interest{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 16px}
    .regplan-interest-form{flex-direction:column;width:100%;gap:9px}
    .regplan-interest-btn{width:100%}
    .regplan-bens li{font-size:12px}
    .reg-plan-switch{font-size:11.5px;margin-top:12px}
    /* Despachos: tarjetas de abogado más compactas */
    .reg-lawyers{gap:12px;margin-bottom:12px}
    .reg-lawcard{padding:16px 14px 4px}
    .reg-lawcard-head{margin-bottom:12px}
    /* CTA visible antes + sin quedar tapado por el chat/overlay */
    .reg-submit{height:52px;font-size:15px;margin-top:18px}
    .reg-secure{margin-top:12px}
    .reg-bottom-pad{height:120px}
    /* CTA discreto del final del listado en móvil */
    .list-help{flex-direction:column;align-items:stretch;gap:14px;padding:20px 18px;margin-top:22px}
    .list-help-btn{width:100%}
    /* Contacto en móvil: una sola columna, formulario debajo del intro */
    .ct{grid-template-columns:1fr;gap:26px}
    .ct-intro h1{font-size:clamp(27px,7.4vw,34px)}
    .ct-sub{max-width:100%}
    .ct-form{padding:22px 20px;border-radius:16px}
    .ct-reasons{margin-top:22px;gap:16px}
    .ct-direct{flex-direction:column;gap:11px}
    /* Para abogados (hub) en móvil — compacto */
    .pro-hero{margin-top:4px}
    .pro-hero h1{font-size:clamp(26px,7.6vw,34px);margin:10px 0 8px}
    .pro-hero-sub{font-size:14.5px}
    .pro-hero-cta{gap:10px;flex-direction:column;width:100%;margin-top:18px}
    .pro-hero-cta .btn{width:100%}
    .pro-cta-main,.pro-cta-alt{height:50px;font-size:15px}
    .pro-launch-hero{text-align:center;margin-top:14px}
    .pro-why{margin-top:26px;padding-top:24px}
    .pro-why-title{margin-bottom:18px}
    .pro-vps{grid-template-columns:1fr 1fr;gap:18px 14px;margin:0}
    .pro-plans-sec{margin-top:30px;padding:26px 18px 24px}
    .pro-plans-head h2{font-size:25px}
    .pro-switch{width:100%;max-width:320px}
    .pro-switch-btn{flex:1;text-align:center;padding:10px 0}
    .plans{grid-template-columns:1fr;gap:16px;max-width:100%}
    .plan{padding:24px 22px}
    /* Login móvil */
    .auth-card{padding:28px 22px;border-radius:18px}
    /* Área privada móvil: barra lateral arriba, navegación horizontal scrollable */
    .acct{grid-template-columns:1fr;gap:18px}
    .acct-side{position:static;padding:16px}
    .acct-nav{flex-direction:row;overflow-x:auto;gap:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
    .acct-nav::-webkit-scrollbar{display:none}
    .acct-navi{flex:none;padding:9px 13px;border:1px solid var(--line);border-radius:999px;font-size:13.5px}
    .acct-navi span{white-space:nowrap}
    .acct-navi.on{border-color:var(--accent-soft)}
    .acct-logout{border-top:none;margin-top:10px;padding-top:10px}
    .acct-main{padding:24px 20px}
    .acct-head h1{font-size:22px}
    .acct-main .reg-submit{max-width:100%}
    .acct-plan-top{flex-direction:column;gap:10px}
    .acct-plan-price{text-align:left}
    .plan-mini{flex-direction:column;align-items:stretch;gap:12px}
    .plan-mini .btn{width:100%}
    .acct-pay{flex-direction:column;align-items:flex-start;gap:12px}
    .acct-pay .btn{width:100%}
    .acct-actions{flex-direction:column}
    .acct-actions .btn{width:100%}
    .reg-modes{grid-template-columns:1fr;gap:10px}
    .reg-sec-title-row{align-items:flex-start;flex-direction:column;gap:8px}
    .reg-lawcard{padding:18px 16px 4px}
    /* firm hero action buttons: stack full-width so 'Contactar despacho' never truncates */
    .firm-hero .fhacts{flex-direction:column;flex-wrap:nowrap;width:100%}
    .firm-hero .fhacts .btn{flex:none;width:100%;min-width:0}
    /* DESPACHO móvil: logo más pequeño y cabecera con más aire */
    .firm-hero{gap:18px;padding-top:8px}
    .firm-hero .fhlogo{width:150px;height:124px;border-radius:14px;justify-self:center}
    .firm-hero .fhlogo .firm-mono>div:first-child{font-size:34px !important}
    .firm-hero .fhlogo .firm-mono>div:last-child{font-size:9px !important;margin-top:6px !important}
    .firm-hero .fhmain h1{font-size:clamp(27px,7.4vw,34px);margin-top:14px}
    /* más separación entre nombre, descripción y ubicación */
    .firm-hero .fhmain .tagline{font-size:15px;margin-top:16px;line-height:1.6;max-width:100%}
    .firm-hero .meta-row{flex-direction:column;align-items:flex-start;gap:11px;margin-top:20px}
    /* métricas: en móvil mostramos solo las creíbles (años, abogados, áreas) */
    .firm-about .firm-stats{display:none}
    /* "Sobre": recortado a ~5 líneas en móvil; se expande con "Leer más" */
    .firm-about-text{overflow:hidden;max-height:8.25em;
       -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);
       mask-image:linear-gradient(180deg,#000 72%,transparent);transition:max-height .3s ease}
    .firm-about-text.expanded{max-height:200em;-webkit-mask-image:none;mask-image:none}
    .firm-about .firm-stats-credible{display:flex;gap:0;margin-top:22px;padding-top:22px}
    .firm-about .firm-stats-credible .firm-stat{flex:1;flex-direction:column;align-items:flex-start;gap:8px}
    .firm-about .firm-stats-credible .firm-stat .ic svg{width:22px;height:22px}
    .firm-about .firm-stats-credible .firm-stat .big{font-size:21px;font-weight:800}
    .firm-about .firm-stats-credible .firm-stat .lbl{font-size:12px;margin-top:0;line-height:1.3}
    /* Áreas de especialización: padding vertical más compacto */
    .spec-box{padding:20px 20px}
    .spec-box h3{margin-bottom:12px}
    .spec-box li{padding:7px 0;font-size:14.5px}
    /* mostrar solo 5 áreas; el resto se revela con "+N más" */
    .spec-box ul:not(.show-all) .spec-extra{display:none}
    .spec-more-btn{display:inline-flex;align-items:center;justify-content:center;
       margin-top:12px;background:var(--bg-warm);border:1px solid var(--line);
       border-radius:999px;padding:8px 16px;font-size:13.5px;font-weight:700;
       color:var(--ink-soft);cursor:pointer}
    /* reducir la separación entre grandes bloques para evitar "scroll infinito" */
    .firm-body{margin-top:36px}
    .firm-lawyers{margin-top:36px}
    /* encabezados de sección homogéneos en móvil (24px) */
    .firm-lawyers .head-row h2{font-size:24px}
    .firm-office{margin-top:36px}
    .firm-office>h2{font-size:24px !important}
    .office-grid{margin-top:18px;gap:16px}
    .office-info{padding:20px 20px}
    .office-info .oi{margin-bottom:16px}
    /* mapa mucho más bajo en móvil */
    .office-map{min-height:0;height:280px;aspect-ratio:auto}
    .office-map-frame{min-height:0;height:280px}
    .office-map-card{max-width:84%;left:12px;bottom:12px;padding:11px 13px}
    /* menos margen antes de "¿Necesitas asesoramiento legal?" */
    #view-firm .profile-cta{margin-top:24px !important}
    /* card de abogado del despacho: apilada en móvil */
    .flaw{grid-template-columns:1fr;margin-bottom:14px}
    .flaw-photo{min-height:200px}
    .flaw-body{padding:16px 18px 4px}
    .flaw-name{font-size:21px}
    .flaw-cta{width:auto;margin:14px 18px 18px;height:46px;justify-self:stretch;justify-content:center}
    .firm-more-btn{margin-top:4px;border-radius:12px;padding:13px 18px;font-size:14.5px}
    /* footer móvil: acordeón desplegable para no ocupar tanto */
    .foot-grid{grid-template-columns:1fr;gap:0}
    .foot-help{flex-direction:column;align-items:stretch;gap:18px;padding:22px 18px;margin-bottom:30px;border-radius:14px}
    .foot-help-tx h3{font-size:18px}
    .foot-help-tx li{font-size:13.5px}
    .foot-help-btn{width:100%;height:46px;font-size:14px}
    .foot-brand{margin-bottom:8px}
    .foot-col{border-top:1px solid var(--line)}
    .foot-col h4{display:flex;align-items:center;justify-content:space-between;
         margin:0;padding:18px 2px;cursor:pointer;font-size:12px;user-select:none}
    .foot-col h4::after{content:"";width:9px;height:9px;border-right:2px solid var(--ink-mute);
         border-bottom:2px solid var(--ink-mute);transform:rotate(45deg);
         margin-bottom:3px;transition:transform .3s ease;flex:none}
    .foot-col.open h4::after{transform:rotate(-135deg);margin-bottom:-3px}
    .foot-col .foot-col-body{max-height:0;overflow:hidden;transition:max-height .35s ease}
    .foot-col.open .foot-col-body{max-height:320px}
    .foot-col .foot-col-body a,
    .foot-col .foot-col-body .socials{margin-bottom:0;padding:0 2px 6px}
    .foot-col .foot-col-body a{padding:9px 2px}
    .foot-col .foot-col-body > :last-child{padding-bottom:18px}
    /* tabs: true horizontal scroll — items must NOT shrink (that caused overlap).
       Scroll stays within the page padding (no negative margin → zero page overflow),
       with a right-edge fade hint so it reads as swipeable (Airbnb/Revolut style). */
    .tabs{gap:18px;overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;
       scrollbar-width:none;padding:0 0 1px;margin:34px 0 0;justify-content:space-between}
    .tabs::-webkit-scrollbar{display:none}
    .tab{flex:none;font-size:14px;padding:8px 0 12px;line-height:1.2}
    .tab .t-full{display:none}
    .tab .t-short{display:inline}
    .tab.active::after{height:1.5px;bottom:0}
    /* PROFILE mobile: header más compacto para llegar antes al contenido */
    .profile-top{gap:16px;padding-top:10px}
    /* foto: misma proporción y encuadre en todos los perfiles + degradado inferior */
    .profile-photo{max-width:100%;width:100%;aspect-ratio:4/3;border-radius:16px;position:relative}
    .profile-photo img{object-position:center 22%}
    .profile-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;
       background:linear-gradient(to top, rgba(20,14,8,.30), rgba(20,14,8,0));pointer-events:none}
    .profile-main h1{font-size:clamp(28px,7.6vw,36px);line-height:1.06}
    .profile-main .subtitle{font-size:15.5px;margin-top:8px}
    .profile-main .badge-role{margin-bottom:12px}
    /* iconos de contacto (Email/Llamar/WhatsApp): tarjetas premium repartidas (móvil) */
    .contact-acts{justify-content:center}
    .contact-icons{width:100%;display:flex;gap:9px;justify-content:stretch}
    .contact-icons .cicon{flex:1;background:var(--paper);border:1px solid var(--line);border-radius:14px;
         padding:13px 4px 11px;gap:7px;box-shadow:0 1px 2px rgba(40,30,15,.04);
         transition:border-color .18s, background .18s, transform .12s}
    .contact-icons .cicon .cicon-c{width:42px;height:42px;border-radius:12px;border:none;
         background:var(--accent-tint);color:var(--accent)}
    .contact-icons .cicon-c svg{width:20px;height:20px}
    .contact-icons .cicon-wa .cicon-c{background:#e3f7ea;color:#0d843e}
    .contact-icons .cicon-wa .cicon-c svg{width:21px;height:21px}
    .contact-icons .cicon:active{transform:scale(.97)}
    .firm-card{margin:16px 0;padding:13px 14px;gap:12px;border-radius:13px}
    .firm-card .fb{width:54px;height:46px}
    .firm-card .fmeta .nm{font-size:15px}
    .firm-card .fmeta .row{margin-top:5px;gap:10px}
    .rating-row{margin:14px 0 16px;gap:12px}
    .contact-acts{gap:10px;margin-top:0}
    .contact-acts .btn{height:50px;font-size:15.5px;border-radius:12px}
    /* "Llamar" pasa a sólido (oscuro) para tener el mismo peso visual que "Contactar" */
    .contact-acts .btn-ghost{background:var(--ink);color:#fff;border-color:var(--ink);
       box-shadow:0 1px 2px rgba(20,14,8,.18)}
    .contact-acts .btn-ghost svg{color:#fff}
    .tab-panel{padding:30px 0 4px}
    .tab-panel h2{font-size:22px;margin-bottom:16px}
    /* "Sobre mí": ancho de lectura cómodo + más aire entre párrafos */
    .tab-panel p{font-size:15.5px;line-height:1.7;max-width:60ch;margin-bottom:22px}
    /* Áreas de práctica: cards más compactas (menos padding, descripción más corta) */
    .tab-panel .prac-card{padding:18px 18px 16px;border-radius:14px}
    .tab-panel .prac-card .ic{width:30px;height:30px;margin-bottom:11px}
    .tab-panel .prac-card h3{font-size:16px;margin-bottom:6px}
    .tab-panel .prac-card p{font-size:13.5px;line-height:1.5;margin-bottom:12px;max-width:none;
       display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
    .tab-panel .prac-card .ml{font-size:12.5px}
    /* Timeline: más separación entre hitos y años más discretos */
    .tab-panel .tl-item{padding-bottom:48px}
    .tab-panel .tl-item .yr{font-size:11px;font-weight:600;color:var(--ink-mute);opacity:.7;letter-spacing:.04em}
    .tab-panel .tl-item h4{font-size:16px;margin:4px 0 5px}
    .tab-panel .tl-item p{font-size:14px;max-width:none;margin-bottom:0}
    /* CTA secundario compacto que aparece dentro de los paneles */
    .cta-mini{margin:30px 0 6px;padding:18px 18px;gap:14px}
    .cta-mini .btn{width:100%;height:46px}
    .cta-band,.profile-cta{flex-direction:column;align-items:flex-start;
       text-align:left;padding:26px 22px;border-radius:18px;gap:16px}
    .cta-band .ic{width:52px;height:52px}
    .cta-band .ic svg{width:25px;height:25px}
    .cta-band h3{font-size:20px}
    .cta-band p{font-size:14.5px}
    .cta-band .acts{width:100%;flex-direction:column;align-items:stretch;gap:14px}
    .cta-band .acts .btn{width:100%}
    .eyebrow{font-size:11px;letter-spacing:.16em}
    .facts{gap:26px}
    /* breadcrumb general en móvil: discreto y en una línea */
    .crumb{font-size:12px;flex-wrap:nowrap;overflow:hidden;white-space:nowrap;gap:7px;padding:18px 0 2px;
       color:var(--ink-mute);opacity:.85;-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);
       mask-image:linear-gradient(90deg,#000 80%,transparent)}
    .crumb svg{width:11px;height:11px}
    /* en el PERFIL del abogado se sustituye por un enlace limpio "← Volver a resultados" */
    #view-lawyer .crumb{display:none}
    .crumb-back{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;
       color:var(--ink-soft);padding:16px 0 4px;cursor:pointer}
    .crumb-back svg{width:16px;height:16px;color:var(--accent);transition:transform .2s}
    .crumb-back:active svg{transform:translateX(-2px)}
  }

  /* —— Small phones —— */
  @media(max-width:400px){
    .wrap{padding:0 15px}
    .nav-logo .logo{font-size:20px}
    .hero h1,.hero-title{font-size:clamp(22px,7vw,30px)}
    .hero h1 .br-hero{display:block;height:0;font-size:0}
    .area-cell{min-width:58px}
    .area-ic{width:33px;height:33px}
    .area-ic svg{width:25px;height:25px}
    .area-cell .lbl{font-size:9.5px}
    /* Registro ultra-compacto a 351px */
    .reg-main{padding:18px 13px 22px}
    .reg-side-top{padding:20px 15px 18px}
    .reg-head h1{font-size:20.5px}
    .reg-acc .reg-sec-title{padding:13px 13px}
    .reg-acc.reg-acc-open .reg-acc-body{padding:13px}
    .reg-field input,.reg-field textarea,.reg-select select{height:43px}
    .reg-chip{font-size:11.5px;padding:5px 11px}
    .reg-photo{gap:12px}
    .reg-avatar{width:66px;height:66px}
    .regplan{padding:13px 13px 14px}
    .regplan-name{font-size:15px}
    .regplan-price b{font-size:21px}
    .regplan-bens li{font-size:11.5px}
    .reg-seg-btn{height:48px;font-size:11px}
    .reg-submit{height:50px;font-size:14.5px}
    .reg-bottom-pad{height:130px}
  }

/* === Hero: beige hasta arriba + degradado superior + base redondeada (estilo Superprof) === */
#hdr{background:linear-gradient(180deg,#fefaf5 0%,#fdf7ee 100%);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent;}
#hdr.scrolled{background:linear-gradient(180deg,#fefaf5 0%,#fdf7ee 100%);border-color:transparent;}
.hero{padding-top:0;padding-bottom:30px;border-radius:0 0 48px 48px;
  background:linear-gradient(180deg,#fdf7ee 0%,#fcf7f0 50%,#fbf9f4 100%);}
.hero-box{background:transparent;border:none;box-shadow:none;border-radius:0;padding:64px 48px 52px;}
/* Titular: 2 líneas, mismo tamaño, más separación antes de "en Canarias" */
.hero-inner{max-width:1080px;}
.hero-title .hl2{display:block;margin-top:.24em;}
@media(max-width:960px){
  .hero{border-radius:0 0 32px 32px}
  .hero-box{padding:22px 22px 40px}
  .hero-inner{max-width:680px}
}
/* Fix móvil: el hero no debe desbordarse en pantallas pequeñas */
@media(max-width:700px){
  .hero-inner{max-width:100%}
  .search-card{max-width:100%}
}


/* === Idiomas en el perfil del abogado === */
.profile-langs{margin-top:30px}
.profile-langs h3{font-family:var(--serif);font-size:18px;font-weight:600;margin-bottom:16px;letter-spacing:-.01em;color:var(--ink)}
.lang-chips{display:flex;flex-wrap:wrap;gap:9px}
.lang-chip{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:600;color:var(--ink-soft);background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:999px;padding:8px 15px;line-height:1}
.lang-chip svg{width:15px;height:15px;color:var(--accent);flex:none}
@media(max-width:640px){.profile-langs{margin-top:32px}.lang-chip{font-size:13px;padding:7px 13px}}