/* ══════════════════════════════════════════════════════════════════
   Company profile page (/firmy/{slug}).
   The site nav, buttons and footer come from main.css + the shared
   fragments, so this file only styles the profile-specific chrome.
   Its extra palette vars (--o, --dk, …) are scoped to the page.
   ══════════════════════════════════════════════════════════════════ */
.company-detail-page {
  --o:#FF4D00;--oh:#E54400;--op:#FFF3EE;--ob:#FFCBAD;
  --dk:#111827;--mid:#374151;--gr:#6B7280;--gl:#9CA3AF;
  --bd:#E5E7EB;--su:#fff;
  --gn:#059669;--gp:#ECFDF5;--gb:#A7F3D0;
  --re:#DC2626;--am:#F59E0B;
}

/* ══ PAGE ══ */
.company-detail-page .page{max-width:1140px;margin:0 auto;padding:22px 24px 80px}
.breadcrumb{display:flex;align-items:center;gap:7px;margin-bottom:18px;flex-wrap:wrap}
.breadcrumb a{font-size:13px;color:var(--gr);text-decoration:none;transition:color .15s}
.breadcrumb a:hover{color:var(--o)}
.breadcrumb span{font-size:13px;color:var(--gl)}
.breadcrumb .cur{font-size:13px;color:var(--mid);font-weight:500}

/* ══ PROFILE HERO ══ */
.hero{background:var(--su);border:1px solid var(--bd);border-radius:18px;overflow:hidden;margin-bottom:20px}
.hero-accent{height:4px;background:linear-gradient(90deg,#4F46E5 0%,#0891B2 50%,#DC4E28 100%)}
.hero-body{padding:22px 26px;display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.hero-logo{width:88px;height:88px;border-radius:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--bd)}
.hero-logo img{width:100%;height:100%;object-fit:cover}
.hero-logo-inner{width:100%;height:100%;background:linear-gradient(135deg,#7B71F5,#4F46E5);display:flex;align-items:center;justify-content:center;font-size:27px;font-weight:900;color:#fff;letter-spacing:.01em}
.hero-info{flex:1;min-width:260px}
.hero-name-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:5px}
.hero-name{font-size:26px;font-weight:900;letter-spacing:-.04em;line-height:1.15}
.verif{display:inline-flex;align-items:center;gap:4px;background:var(--gp);color:#047857;border:1px solid var(--gb);border-radius:20px;padding:3px 9px;font-size:11px;font-weight:700;white-space:nowrap}
.verif svg{width:11px;height:11px}
.plan-tag{display:inline-flex;align-items:center;gap:4px;background:linear-gradient(135deg,#FFF3EE,#FFE4D6);color:var(--o);border:1px solid var(--ob);border-radius:20px;padding:3px 9px;font-size:10px;font-weight:800;letter-spacing:.06em}
.hero-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.cat-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px}
.cat-pill-icon{display:inline-flex}
.cat-pill-icon svg{width:12px;height:12px;flex-shrink:0}
.hero-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hm{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--gr)}
.hm svg{width:14px;height:14px;color:var(--gl);flex-shrink:0}
.hm strong{color:var(--dk);font-weight:700}
.stars{display:inline-flex;gap:1px;color:var(--am);font-size:13px;letter-spacing:-1px}
.hero-actions{display:flex;flex-direction:column;gap:8px;min-width:196px}
.act-primary{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px 22px;background:var(--o);color:#fff;border:none;border-radius:11px;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;transition:all .18s;text-decoration:none}
.act-primary:hover{background:var(--oh);transform:translateY(-1px);box-shadow:0 4px 14px rgba(255,77,0,.3)}
.act-primary svg{width:15px;height:15px}
.act-row{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.act-sec{display:flex;align-items:center;justify-content:center;gap:5px;padding:10px 8px;background:var(--su);border:1.5px solid var(--bd);border-radius:10px;font-size:12px;font-weight:700;color:var(--mid);cursor:pointer;font-family:inherit;transition:all .18s;text-decoration:none}
.act-sec:hover{border-color:var(--o);color:var(--o);background:var(--op)}
.act-sec svg{width:13px;height:13px;flex-shrink:0}
/* Phone reveal */
@keyframes popIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.phone-box{grid-column:span 2;background:var(--op);border:1px solid var(--ob);border-radius:10px;padding:10px 12px;animation:popIn .18s ease}
.phone-num{font-size:16px;font-weight:900;color:var(--o);display:block;margin-bottom:8px;letter-spacing:.03em}
.phone-row{display:flex;gap:6px}
.ph-link{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:700;padding:6px;border-radius:7px;cursor:pointer;text-decoration:none;border:none;font-family:inherit;transition:all .15s}
.ph-call{background:var(--o);color:#fff}.ph-call:hover{background:var(--oh)}
.ph-copy{background:var(--su);border:1.5px solid var(--ob);color:var(--o)}.ph-copy:hover{background:#FFF0E8}

/* ══ LAYOUT ══ */
.grid{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start}
.main-col{min-width:0;display:flex;flex-direction:column;gap:16px}

/* ══ CARD ══ */
.card{background:var(--su);border:1px solid var(--bd);border-radius:16px;overflow:hidden}
.card-head{padding:16px 22px 14px;border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-title{font-size:15px;font-weight:800;letter-spacing:-.015em;display:flex;align-items:center;gap:8px}
.card-title svg{width:16px;height:16px;color:var(--o)}
.card-count{font-size:11px;font-weight:700;background:var(--bg);color:var(--gr);padding:2px 8px;border-radius:20px}
.card-body{padding:20px 22px}

/* About */
.about-text{font-size:14px;line-height:1.75;color:var(--mid);white-space:pre-line}

/* Services grid */
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.svc{display:flex;align-items:center;gap:11px;border:1px solid var(--bd);border-radius:12px;padding:13px 14px;transition:all .18s}
.svc:hover{border-color:#D1D5DB;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.svc-ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.svc-name{font-size:13px;font-weight:700;color:var(--dk);line-height:1.3}
.svc-desc{font-size:11px;color:var(--gl);margin-top:2px}

/* Portfolio */
.port-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.port{aspect-ratio:4/3;border-radius:11px;overflow:hidden;cursor:pointer;position:relative;transition:transform .18s;border:1px solid var(--bd)}
.port:hover{transform:scale(1.02)}
.port img{width:100%;height:100%;object-fit:cover;display:block}
.port::after{content:'🔍';position:absolute;inset:0;background:rgba(17,24,39,.45);display:flex;align-items:center;justify-content:center;font-size:19px;opacity:0;transition:opacity .18s}
.port:hover::after{opacity:1}
.port-empty{font-size:13px;color:var(--gl)}

/* References (images + document tiles) */
.ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ref{aspect-ratio:4/3;border-radius:11px;overflow:hidden;position:relative;border:1px solid var(--bd);text-decoration:none;display:block;transition:transform .18s,box-shadow .18s}
.ref:hover{transform:scale(1.02);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.ref img{width:100%;height:100%;object-fit:cover;display:block}
.ref-doc{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;background:var(--bg);text-align:center}
.ref-doc svg{width:30px;height:30px;color:var(--o);flex-shrink:0}
.ref-doc-name{font-size:11px;font-weight:600;color:var(--mid);line-height:1.35;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Location map */
.company-map{height:180px;border-radius:11px;overflow:hidden;margin-bottom:10px;border:1px solid var(--bd);z-index:0}

/* Lightbox */
.lb{position:fixed;inset:0;background:rgba(9,12,20,.9);display:none;align-items:center;justify-content:center;z-index:500;padding:24px;backdrop-filter:blur(3px)}
.lb.open{display:flex;animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.lb-img{max-width:min(880px,92vw);max-height:82vh;width:auto;border-radius:14px;display:block;object-fit:contain}
.lb-close{position:absolute;top:20px;right:22px;width:40px;height:40px;border-radius:11px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);color:#fff;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}
.lb-close:hover{background:rgba(255,255,255,.2)}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);color:#fff;font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}
.lb-nav:hover{background:rgba(255,255,255,.2)}
.lb-prev{left:22px}.lb-next{right:22px}
.lb-cap{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.75);font-size:13px;font-weight:500;max-width:80vw;text-align:center}

/* Reviews */
.rating-sum{display:flex;gap:26px;align-items:center;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--bd);flex-wrap:wrap}
.rs-big{text-align:center;flex-shrink:0}
.rs-num{font-size:40px;font-weight:900;letter-spacing:-.05em;line-height:1;color:var(--dk)}
.rs-stars{color:var(--am);font-size:15px;letter-spacing:-.5px;margin-top:5px}
.rs-count{font-size:11px;color:var(--gl);margin-top:4px}
.rs-bars{flex:1;min-width:180px;display:flex;flex-direction:column;gap:5px}
.rs-bar-row{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--gr)}
.rs-bar-lbl{width:26px;flex-shrink:0;text-align:right}
.rs-bar{flex:1;height:6px;background:var(--bg);border-radius:4px;overflow:hidden}
.rs-bar-fill{height:100%;background:var(--am);border-radius:4px}
.rs-bar-n{width:22px;text-align:right;flex-shrink:0;color:var(--gl)}

.rev{padding:16px 0;border-bottom:1px solid var(--bd)}
.rev:last-child{border-bottom:none;padding-bottom:0}
.rev:first-child{padding-top:0}
.rev-head{display:flex;align-items:flex-start;gap:11px;margin-bottom:9px}
.rev-av{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff;flex-shrink:0}
.rev-who{flex:1;min-width:0}
.rev-co{font-size:13px;font-weight:700;color:var(--dk)}
.rev-person{font-size:11px;color:var(--gl);margin-top:1px}
.rev-right{text-align:right;flex-shrink:0}
.rev-stars{color:var(--am);font-size:12px;letter-spacing:-.5px}
.rev-date{font-size:11px;color:var(--gl);margin-top:2px}
.rev-text{font-size:13px;line-height:1.65;color:var(--mid)}
.rev-text::before{content:'„';color:var(--ob);font-size:20px;font-weight:900;line-height:0;vertical-align:-4px;margin-right:2px}

/* Placeholder note on stubbed sections */
.stub-note{font-size:11px;color:var(--gl);margin-top:12px;font-style:italic}

/* ══ SIDEBAR ══ */
.side{display:flex;flex-direction:column;gap:14px;position:sticky;top:84px}
.side-card{background:var(--su);border:1px solid var(--bd);border-radius:16px;overflow:hidden}
.side-head{padding:13px 17px 11px;border-bottom:1px solid var(--bd);font-size:12px;font-weight:800;color:var(--mid);display:flex;align-items:center;gap:7px}
.side-head svg{width:14px;height:14px;color:var(--o)}
.side-body{padding:15px 17px}

/* Stats */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bd)}
.stat{background:var(--su);padding:15px 12px;text-align:center}
.stat-v{font-size:20px;font-weight:900;letter-spacing:-.03em;color:var(--dk);line-height:1}
.stat-v .acc{color:var(--o)}
.stat-l{font-size:10px;color:var(--gl);margin-top:4px;font-weight:500}

/* Info rows */
.irow{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--bg)}
.irow:last-child{border-bottom:none;padding-bottom:0}
.irow:first-child{padding-top:0}
.irow-ico{width:16px;flex-shrink:0;color:var(--gl);margin-top:1px}
.irow-ico svg{width:15px;height:15px}
.irow-lbl{font-size:11px;color:var(--gl);margin-bottom:2px}
.irow-val{font-size:13px;font-weight:600;color:var(--dk);line-height:1.45}
.irow-val a{color:var(--o);text-decoration:none}.irow-val a:hover{text-decoration:underline}
/* Click-to-reveal contact button (anti-harvest): looks like the link it becomes */
.contact-reveal{font:inherit;color:var(--o);background:none;border:none;padding:0;cursor:pointer;text-decoration:none}
.contact-reveal:hover{text-decoration:underline}

/* Area map */
.area-visual{background:var(--bg);border-radius:11px;padding:14px;text-align:center;margin-bottom:10px}
.area-badge{display:inline-flex;align-items:center;gap:6px;background:var(--su);border:1.5px solid var(--o);color:var(--o);border-radius:20px;padding:5px 13px;font-size:12px;font-weight:800}
.area-list{display:flex;flex-wrap:wrap;gap:5px}
.area-chip{background:var(--bg);border:1px solid var(--bd);border-radius:20px;padding:3px 9px;font-size:11px;font-weight:600;color:var(--mid)}

/* Tags */
.tag-cloud{display:flex;flex-wrap:wrap;gap:5px}
.tag{background:var(--op);border:1px solid var(--ob);color:var(--o);border-radius:20px;padding:3px 10px;font-size:11px;font-weight:700}

/* Trust list */
.trust{display:flex;align-items:center;gap:8px;padding:8px 0;font-size:12px;color:var(--mid)}
.trust svg{width:14px;height:14px;color:var(--gn);flex-shrink:0}

/* Similar companies */
.simco{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bg);text-decoration:none;color:inherit;transition:opacity .15s}
.simco:last-child{border-bottom:none;padding-bottom:0}
.simco:hover{opacity:.72}
.simco-av{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;flex-shrink:0}
.simco-n{font-size:12px;font-weight:700;color:var(--dk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simco-m{font-size:10px;color:var(--gl);margin-top:1px;display:flex;align-items:center;gap:4px}

/* ══ RWD ══ */
@media(max-width:1000px){
  .grid{grid-template-columns:1fr}
  .side{position:static}
}
@media(max-width:760px){
  .company-detail-page .page{padding:16px 16px 68px}
  .hero-body{padding:18px;gap:16px}
  .hero-logo{width:64px;height:64px;border-radius:16px}
  .hero-logo-inner{font-size:20px}
  .hero-name{font-size:21px}
  .hero-actions{width:100%;min-width:0}
  .svc-grid{grid-template-columns:1fr}
  .card-body{padding:17px 18px}
  .card-head{padding:14px 18px 12px}
}
@media(max-width:460px){
  .port-grid,.ref-grid{grid-template-columns:repeat(2,1fr)}
  .rating-sum{gap:16px}
  .rs-num{font-size:32px}
}
