/*
Theme Name: Advokat Gazić
Theme URI: https://advokatgazic.com/
Author: Advokatska kancelarija Emir Gazić
Description: Lagana i responzivna WordPress tema za advokatsku kancelariju Emir Gazić. Nije potrebna Divi tema.
Version: 2.3.1
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: advokat-gazic
License: GPL-2.0-or-later
*/
:root{--red:#e94c51;--red-dark:#b83038;--ink:#242326;--muted:#64676b;--white:#fff;--paper:#f7f7f6;--line:#e4e4e4;--container:1150px;--radius:13px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--ink);font:16px/1.72 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto}a{color:var(--red-dark);text-underline-offset:.18em}a:hover{color:var(--red)}button,input,textarea{font:inherit}button{cursor:pointer}h1,h2,h3,h4{line-height:1.18;letter-spacing:-.024em;margin:0 0 .85em;font-weight:750}h1{font-size:clamp(2.3rem,5.2vw,5rem)}h2{font-size:clamp(1.85rem,3.2vw,2.85rem)}h3{font-size:1.22rem}p{margin:0 0 1.15rem}ul,ol{padding-left:1.3em}.container{width:min(var(--container),calc(100% - 40px));margin-inline:auto}.narrow{max-width:750px}.section{padding:clamp(64px,8vw,112px) 0}.section--soft{background:var(--paper)}.eyebrow{color:var(--red-dark);font-size:.78rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}.muted{color:var(--muted)}.center{text-align:center}.lede{font-size:clamp(1.05rem,1.9vw,1.3rem);color:#4c4c4e;max-width:800px}.section-head{max-width:770px;margin-bottom:38px}.section-head.center{margin-inline:auto}.section-head h2{margin-top:12px}.section-head p{color:var(--muted)}.skip-link{position:absolute;left:-999px;top:10px;z-index:9999;padding:10px 14px;background:#fff;color:#111}.skip-link:focus{left:10px}.site-header{background:#fff;position:relative;z-index:20;border-bottom:1px solid #eee}.header-layout{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}.branding{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.branding img{display:block;width:116px;max-height:65px;object-fit:contain;object-position:left center}.brand-copy{border-left:1px solid #ddd;padding-left:13px;line-height:1.25}.brand-copy strong{font-size:.86rem;display:block;text-transform:uppercase;letter-spacing:.025em}.brand-copy span{font-size:.73rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.desktop-nav ul{display:flex;align-items:center;gap:clamp(15px,2vw,30px);padding:0;margin:0;list-style:none}.desktop-nav a{text-decoration:none;color:#2b2b2d;font-weight:800;font-size:.76rem;letter-spacing:.075em;text-transform:uppercase}.desktop-nav a:hover,.desktop-nav .current-menu-item>a,.desktop-nav .current_page_item>a{color:var(--red-dark)}.desktop-nav .nav-contact a{border:1px solid var(--red);border-radius:4px;padding:10px 16px;color:var(--red-dark)}.mobile-nav{display:none}.hero{position:relative;isolation:isolate;min-height:min(650px,72vh);display:flex;align-items:center;overflow:hidden;background:#f0f0ee}.hero-image,.image-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-image{z-index:-2;object-position:center center}.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.90),rgba(255,255,255,.42) 66%,rgba(255,255,255,.08));z-index:-1}.hero-content{padding:100px 0 112px}.hero-title{font-size:clamp(3.3rem,9.2vw,8.1rem);letter-spacing:-.074em;line-height:.98;margin:20px 0 30px;color:#19191b}.hero-title span{color:var(--red)}.hero-subtitle{max-width:600px;font-size:1.13rem;color:#3b3b40}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:32px}.button{display:inline-flex;align-items:center;justify-content:center;text-align:center;background:var(--red);color:white!important;border:2px solid var(--red);border-radius:5px;min-height:48px;padding:11px 24px;text-decoration:none;font-size:.83rem;font-weight:800;letter-spacing:.055em;transition:background .2s,border-color .2s}.button:hover{background:var(--red-dark);border-color:var(--red-dark)}.button--ghost{background:rgba(255,255,255,.6);color:var(--ink)!important;border-color:var(--ink)}.button--ghost:hover{background:var(--ink);color:white!important;border-color:var(--ink)}.practice-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--red-dark)}.practice-strip a{min-height:150px;text-decoration:none;color:white;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:11px;padding:20px 10px;text-align:center;background:#bd3339}.practice-strip a:nth-child(2){background:#cf3e44}.practice-strip a:nth-child(3){background:#df484e}.practice-strip a:nth-child(4){background:#e94c51}.practice-strip a:hover{filter:brightness(.90)}.practice-strip svg{width:33px;height:33px;stroke:currentColor;fill:none;stroke-width:1.5}.practice-strip span{font-weight:800;font-size:.77rem;letter-spacing:.04em;text-transform:uppercase}.split{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:clamp(32px,7vw,100px)}.split p{color:#505057}.fact-list{border-top:1px solid var(--line);margin:28px 0 30px;padding:0;list-style:none}.fact-list li{padding:13px 0;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center}.fact-list li::before{content:"";width:8px;height:8px;display:block;border:2px solid var(--red);border-radius:50%;flex-shrink:0}.frame-art{position:relative;min-height:340px;border-radius:8px;overflow:hidden;background:#f3f3f1}.frame-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.frame-art .art-label{position:absolute;bottom:20px;left:20px;right:20px;max-width:290px;padding:18px 21px;background:rgba(255,255,255,.92);border-left:4px solid var(--red);font-size:.79rem;font-weight:750;letter-spacing:.07em;text-transform:uppercase}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.practice-card{display:flex;flex-direction:column;min-height:270px;padding:29px 23px 26px;border:1px solid #e8e8e8;border-top:4px solid var(--red);border-radius:var(--radius);background:#fff;box-shadow:0 9px 26px rgba(0,0,0,.035)}.practice-card svg{width:38px;height:38px;fill:none;stroke:var(--red);stroke-width:1.5;margin-bottom:23px}.practice-card h3{font-size:1.15rem}.practice-card p{font-size:.92rem;color:var(--muted);flex:1}.text-link{font-size:.82rem;font-weight:800;text-decoration:none}.text-link::after{content:" →"}.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.value{padding:6px 0}.value strong{display:block;font-size:1.1rem;margin:12px 0 7px}.value p{color:var(--muted);font-size:.95rem}.value-number{font-size:.75rem;font-weight:900;color:var(--red);letter-spacing:.08em}.architectural-panel{position:relative;background:#f4f4f3;overflow:hidden;isolation:isolate}.architectural-panel>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.42}.architectural-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.72));z-index:-1}.contact-banner{background:var(--red);padding:34px 0;color:#fff}.contact-banner-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}.contact-banner h2{font-size:clamp(1.45rem,2.3vw,2.3rem);margin:0}.contact-banner p{margin:4px 0 0;color:rgba(255,255,255,.92)}.button--light{background:white;color:var(--red-dark)!important;border-color:white}.button--light:hover{background:var(--ink);color:white!important;border-color:var(--ink)}.contact-bottom{position:relative;isolation:isolate;background:#212124;color:#fff;overflow:hidden;padding:78px 0}.contact-bottom>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 16%;opacity:.65;z-index:-1}.contact-bottom .lede{color:#d5d5d8}.contact-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:34px}.contact-detail{border-top:2px solid var(--red);padding-top:15px}.contact-detail small{display:block;color:#f3b9ba;text-transform:uppercase;font-weight:800;letter-spacing:.09em;margin-bottom:5px}.contact-detail a{color:white}.contact-detail p{margin:0}.site-footer{background:#171719;color:#aaa;padding:27px 0;font-size:.85rem}.footer-layout{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.site-footer a{color:#ddd;text-decoration:none}.site-footer a:hover{color:white}.footer-links{display:flex;flex-wrap:wrap;gap:18px}.page-hero{position:relative;isolation:isolate;background:#f3f3f2;overflow:hidden;padding:70px 0 72px}.page-hero>img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28}.page-hero::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.55);z-index:-1}.page-hero h1{font-size:clamp(2.25rem,5vw,4rem);max-width:850px;margin:15px 0}.breadcrumbs{font-size:.78rem;color:#54545b}.breadcrumbs a{color:inherit;text-decoration:none}.breadcrumbs span{margin:0 9px;color:var(--red)}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:65px;align-items:start}.content-body{font-size:1.05rem}.content-body h2{margin:1.5em 0 .4em;font-size:1.8rem}.content-body h2:first-child{margin-top:0}.content-body h3{margin-top:1.45em}.content-body a{overflow-wrap:anywhere}.content-body p{color:#414149}.content-body li{padding:.2em 0}.side-panel{background:#f7f7f6;border-top:4px solid var(--red);padding:28px;border-radius:0 0 10px 10px}.side-panel h2{font-size:1.3rem}.side-panel p{font-size:.92rem;color:#5b5b62}.side-panel .button{width:100%}.side-panel .side-links{list-style:none;padding:0;margin:22px 0}.side-panel .side-links li{border-top:1px solid #d8d8d8}.side-panel .side-links a{display:block;padding:11px 0;text-decoration:none;font-size:.92rem;font-weight:700;color:var(--ink)}.side-panel .side-links a:hover{color:var(--red-dark)}.page-footer-cta{padding:36px 0;background:var(--paper);border-top:1px solid var(--line);margin-top:55px}.page-footer-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}.page-footer-cta h2{font-size:1.5rem;margin:0}.page-footer-cta p{margin:6px 0 0;color:var(--muted)}.notice{border-left:3px solid var(--red);padding:14px 18px;background:#f9f8f7;font-size:.88rem;color:#4f4f54;margin-top:35px}.contact-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:65px}.contact-info h2,.contact-form h2{font-size:1.6rem}.info-row{padding:20px 0;border-bottom:1px solid var(--line)}.info-row strong{display:block;color:var(--red-dark);font-size:.75rem;letter-spacing:.11em;text-transform:uppercase}.info-row a{color:var(--ink)}.contact-form{background:#f7f7f6;padding:35px;border-radius:10px;border-top:4px solid var(--red)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-field{margin-bottom:17px}.form-field label{display:block;font-weight:750;font-size:.85rem;margin-bottom:5px}.form-field input,.form-field textarea{width:100%;min-height:46px;border:1px solid #c9c9c9;border-radius:4px;padding:10px 13px;background:white;color:var(--ink)}.form-field textarea{min-height:145px;resize:vertical}.form-field input:focus-visible,.form-field textarea:focus-visible,.button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #9e2d37;outline-offset:3px}.form-note{font-size:.82rem;color:#626269}.form-checkbox{display:flex;align-items:flex-start;gap:10px;margin-bottom:20px;font-size:.88rem}.form-checkbox input{margin-top:6px}.form-feedback{padding:13px;border-radius:5px;margin-bottom:20px}.form-feedback--success{background:#e8f5ed;color:#13492c}.form-feedback--error{background:#fff0ef;color:#802526}.honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.wp-block-image img{height:auto}.alignwide{width:min(100%,1050px)}.entry-content img{height:auto}.entry-content>*:first-child{margin-top:0}.article-list{display:grid;gap:18px}.article-list article{border:1px solid var(--line);padding:25px}.article-list h2{font-size:1.35rem}.sr-only{clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.nav-arrows{display:flex;gap:15px;margin-top:30px}.nav-arrows a{font-weight:700}.error-404{text-align:center;padding:120px 0}.error-404 h1{font-size:5rem}
@media(max-width:1000px){.brand-copy{display:none}.desktop-nav ul{gap:14px}.cards{grid-template-columns:repeat(2,1fr)}.content-grid{gap:35px;grid-template-columns:minmax(0,1fr) 275px}.contact-layout{gap:35px}}
@media(max-width:720px){.container{width:calc(100% - 34px)}.section{padding:60px 0}.header-layout{min-height:70px}.branding img{width:102px;max-height:50px}.desktop-nav{display:none}.mobile-nav{display:block;position:relative}.mobile-nav>summary{cursor:pointer;list-style:none;border:1px solid #ddd;border-radius:5px;padding:9px 14px;font-size:.8rem;font-weight:800}.mobile-nav>summary::-webkit-details-marker{display:none}.mobile-nav>summary::after{content:" ☰";font-size:1rem}.mobile-nav[open]>summary::after{content:" ×"}.mobile-nav ul{position:absolute;right:0;top:42px;width:min(285px,86vw);background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.17);border:1px solid #eee;border-radius:8px;list-style:none;margin:0;padding:8px 16px;z-index:40}.mobile-nav li a{display:block;padding:11px 0;color:#222;text-decoration:none;font-size:.87rem;font-weight:700;border-bottom:1px solid #eee}.hero{min-height:500px}.hero-content{padding:80px 0 96px}.hero-title{font-size:clamp(3.1rem,12.2vw,5rem);margin:18px 0 22px}.hero-subtitle{font-size:1.03rem}.hero::before{background:linear-gradient(90deg,rgba(255,255,255,.90),rgba(255,255,255,.53))}.practice-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.practice-strip a{min-height:122px}.split,.content-grid,.contact-layout{grid-template-columns:1fr;gap:28px}.frame-art{min-height:280px}.values{grid-template-columns:1fr;gap:8px}.contact-banner-inner,.page-footer-cta-inner{align-items:flex-start;flex-direction:column}.contact-details{grid-template-columns:1fr;gap:20px}.page-hero{padding:50px 0 52px}.contact-bottom{padding:56px 0}.side-panel{order:2}.form-grid{grid-template-columns:1fr;gap:0}.contact-form{padding:22px}}
@media(max-width:480px){.cards{grid-template-columns:1fr}.hero-actions .button{width:100%}.practice-strip span{font-size:.69rem}.hero-title{font-size:clamp(2.6rem,12.5vw,4rem)}.hero-subtitle{font-size:.98rem}.contact-banner{padding:29px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.header-tools{display:flex;align-items:center;gap:16px}.lang-switch{display:flex;gap:6px;align-items:center;font-size:.78rem;font-weight:850;color:#999;white-space:nowrap}.lang-switch a{color:#555;text-decoration:none;padding:5px 3px}.lang-switch a[aria-current="page"]{color:var(--red-dark);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}.area-list{display:grid;gap:12px;margin:35px 0}.area-list-item{display:flex;align-items:center;gap:16px;padding:18px 21px;border:1px solid #ddd;border-left:4px solid var(--red);border-radius:4px;text-decoration:none;color:var(--ink)}.area-list-item svg{width:28px;height:28px;stroke:var(--red-dark);fill:none;stroke-width:1.5}.area-list-item strong{flex:1}.area-list-item span{color:var(--red-dark)}.area-list-item:hover{background:#faf5f5}.page-hero .eyebrow{display:block;margin-top:25px}.form-field input:focus,.form-field textarea:focus{border-color:var(--red-dark)}@media(max-width:720px){.lang-switch{font-size:.82rem}.header-layout{gap:12px}.header-tools{gap:12px}.brand-copy{display:none}}

/* v1.1: distinct practice-area cards and a discreet factual Maps profile link */
.maps-link{display:inline-block;margin-top:9px;font-size:.83rem;text-decoration:underline;text-underline-offset:3px}.practice-card h3{overflow-wrap:anywhere}.practice-card{min-height:260px}@media (max-width:1000px){.practice-strip span{font-size:.7rem}}

/* v1.2: friendlier Bosnian/English content and readability improvements */
.entry-content ul{padding-left:1.35rem;margin:12px 0 22px}.entry-content li{line-height:1.62}.entry-content h2{letter-spacing:-.01em}.practice-card p{line-height:1.55}.hero-subtitle{max-width:650px}

/* v1.3 — two-column hero; the original background photograph is unchanged. */
.hero{min-height:640px}
.hero::before{background:linear-gradient(90deg,rgba(255,255,255,.91),rgba(255,255,255,.61) 58%,rgba(255,255,255,.45))}
.hero-content--with-form{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(335px,.82fr);gap:clamp(32px,5vw,72px);align-items:center;padding:65px 0 70px}
.hero-intro{min-width:0;max-width:625px}
.hero-intro .eyebrow{display:block}
.hero-intro .hero-title{font-size:clamp(3.75rem,6.4vw,6.8rem);line-height:1;letter-spacing:-.067em;margin:19px 0 22px}
.hero-focus{font-size:clamp(1.2rem,1.9vw,1.55rem);font-weight:760;line-height:1.35;max-width:540px;margin-bottom:12px;color:#242326}
.hero-intro .hero-subtitle{font-size:1rem;margin-bottom:0;color:#414148}
.hero-intro .hero-actions{margin-top:29px;gap:23px}
.hero-phone{font-weight:750;color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:5px;white-space:nowrap}
.hero-form-wrap{min-width:0;scroll-margin-top:20px}
.contact-form--hero{background:#fff;border-top:4px solid var(--red);padding:27px 29px 25px;border-radius:11px;box-shadow:0 18px 48px rgba(32,31,33,.13)}
.contact-form--hero h2{font-size:1.48rem;margin-bottom:8px;letter-spacing:-.02em}
.contact-form--hero .form-note{font-size:.78rem;line-height:1.55;margin:0 0 16px}
.contact-form--hero .form-grid{grid-template-columns:1fr 1fr;gap:12px}
.contact-form--hero .form-field{margin-bottom:12px}
.contact-form--hero .form-field label{font-size:.78rem;margin-bottom:4px}
.contact-form--hero .form-field input,.contact-form--hero .form-field textarea{min-height:43px;padding:8px 11px;font-size:.89rem}
.contact-form--hero .form-field textarea{min-height:90px}
.contact-form--hero .form-checkbox{font-size:.76rem;line-height:1.45;margin:10px 0 14px}
.contact-form--hero .form-checkbox input{flex:none;margin-top:3px}
.contact-form--hero .button{width:100%;min-height:45px}
.contact-form--hero .button + .form-note{margin-top:11px;margin-bottom:0}
@media(max-width:940px){.hero-content--with-form{grid-template-columns:minmax(0,1fr) minmax(300px,.93fr);gap:26px}.hero-intro .hero-title{font-size:clamp(3rem,6.5vw,5.5rem)}.contact-form--hero{padding:24px 20px}}
@media(max-width:720px){.hero{min-height:0}.hero::before{background:linear-gradient(180deg,rgba(255,255,255,.78) 0%,rgba(255,255,255,.78) 33%,rgba(255,255,255,.91) 75%)}.hero-content--with-form{display:grid;grid-template-columns:1fr;padding:58px 0 55px;gap:29px}.hero-intro .hero-title{font-size:clamp(3rem,12vw,5rem);margin:14px 0 18px}.hero-focus{font-size:1.24rem}.hero-intro .hero-actions{gap:16px;margin-top:23px}.hero-form-wrap{max-width:610px;width:100%;margin-inline:auto}.contact-form--hero{padding:25px}.contact-form--hero .form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.hero-content--with-form{padding:45px 0 45px}.hero-intro .hero-title{font-size:clamp(2.7rem,12.4vw,4rem)}.hero-intro .hero-actions .button{width:auto}.hero-intro .hero-actions{align-items:flex-start;flex-direction:column}.contact-form--hero{padding:23px 19px}.contact-form--hero .form-grid{grid-template-columns:1fr;gap:0}}

/* v1.9: prominent header call action and restored hero inquiry form. */
.header-layout{gap:clamp(12px,1.6vw,24px)}
.header-phone{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:none;white-space:nowrap;background:var(--red-dark);color:#fff;text-decoration:none;border:2px solid var(--red-dark);border-radius:7px;padding:11px 16px;font-size:clamp(1.03rem,1.37vw,1.2rem);line-height:1.2;font-weight:850;font-variant-numeric:tabular-nums;letter-spacing:-.025em;transition:background-color .15s,box-shadow .15s}
.header-phone:hover,.header-phone:focus-visible{background:#832229;border-color:#832229;color:#fff;box-shadow:0 3px 13px #0002}
.header-phone svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.desktop-nav ul{gap:clamp(12px,1.35vw,22px)}
.desktop-nav a[aria-current="page"]{color:var(--red-dark)}
.hero{min-height:640px}
.hero::before{background:linear-gradient(90deg,rgba(255,255,255,.91) 0%,rgba(255,255,255,.72) 48%,rgba(255,255,255,.34) 100%)}
.maps-link svg,.info-row svg,.footer-links svg{display:inline-block;vertical-align:-3px;margin-right:7px;height:16px;width:16px;stroke:currentColor;stroke-width:1.8;fill:none}
.footer-links a{display:inline-flex;align-items:center}
@media(max-width:1070px){.header-layout{gap:13px}.desktop-nav ul{gap:13px}.header-phone{padding:10px 12px;font-size:1rem}.header-phone svg{width:17px;height:17px}}
@media(max-width:720px){
 .header-layout{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;align-items:center;padding-block:9px 12px}
 .branding{grid-column:1;grid-row:1;min-width:0}
 .header-tools{grid-column:2;grid-row:1;gap:12px;justify-self:end}
 .header-phone{grid-column:1 / -1;grid-row:2;justify-self:stretch;font-size:1.16rem;min-height:48px;padding:10px 14px}
 .header-phone svg{width:20px;height:20px}
 .hero{min-height:0}
 .hero::before{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.9) 80%)}
}
@media(max-width:480px){
 .header-layout{gap:8px 10px}

}

/* Keep the new courthouse photo framed around the columns on narrow screens. */
@media(max-width:720px){.contact-bottom>img{object-position:55% center;opacity:.55}}


/* v1.10: service cards use the classic law icon and the areas page matches the homepage card grid. */
.card-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0 auto 23px 0}
.practice-card .card-icon img{display:block;max-width:40px;max-height:40px;width:auto;height:auto;filter:brightness(0) saturate(100%) invert(29%) sepia(90%) saturate(1630%) hue-rotate(334deg) brightness(95%) contrast(88%)}
.practice-card{text-align:left}
.practice-card .card-icon{margin-bottom:23px}
.cards--areas{margin-top:34px}
@media(max-width:720px){.cards--areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.cards--areas{grid-template-columns:1fr}.practice-card .card-icon{justify-content:flex-start}}

/* v1.11: the original logo carries the office name; show it alone in the header. */
.branding{flex:0 0 auto}
.branding img{width:clamp(128px,12.8vw,162px);max-width:162px;max-height:84px;object-fit:contain;object-position:left center}
@media(max-width:720px){.branding img{width:130px;max-width:130px;max-height:70px}}


/* v1.12: large service cards use the same centered scales icon as the 4 hero category blocks. */
.practice-card .card-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0 auto 23px}
.practice-card .card-icon svg{display:block;width:36px;height:36px;stroke:var(--red);fill:none;stroke-width:1.5}
.practice-card h3,.practice-card p,.practice-card .text-link{text-align:center}
.cards--areas .practice-card,.section--soft .practice-card{align-items:center}
@media(max-width:560px){.practice-card .card-icon{margin:0 auto 23px}}


/* v13: roomy three-column practice cards on homepage and full-width practice-areas page. */
.cards { grid-template-columns:repeat(3,minmax(0,1fr));gap:22px }
.cards--areas { margin-top:34px }
.practice-areas-intro { max-width:860px;margin-bottom:32px }
.practice-areas-intro p { font-size:1.06rem;line-height:1.75 }
.cards--areas .practice-card-title { font-size:1.15rem;line-height:1.3;margin:0 0 14px;font-weight:750 }
.cards--areas .practice-card-title,.cards--areas .practice-card p { text-align:center }
@media (min-width:1001px) { .cards .practice-card:last-child:nth-child(3n+1) { grid-column:2 } }
@media (max-width:1000px) { .cards { grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (max-width:600px) { .cards { grid-template-columns:1fr } }


/* v15: transparent navigation sits directly over the site's existing architecture
   photography (desktop and mobile), without a separate white header strip. */
.site-header--overlay{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:30;
    background:transparent;
    border-bottom:0;
}
.site-header--overlay .header-layout{min-height:98px}
/* Reserve room beneath the overlaid header so it never obscures hero copy. */
.site-header--overlay + main > .hero .hero-content--with-form{
    padding-top:clamp(155px,12vw,190px);
    padding-bottom:78px;
}
.site-header--overlay + main > .page-hero{
    padding-top:162px;
    padding-bottom:72px;
}
@media (max-width:940px) and (min-width:721px){
  .site-header--overlay + main > .hero .hero-content--with-form{padding-top:160px}
}
@media (max-width:720px){
  .site-header--overlay .header-layout{min-height:0}
  .site-header--overlay + main > .hero .hero-content--with-form{
      padding-top:185px;
      padding-bottom:52px;
  }
  .site-header--overlay + main > .page-hero{
      padding-top:188px;
      padding-bottom:55px;
  }
}

/* v2.1.3 — simple, full-width editorial “Zašto izabrati nas?” below Naš pristup. */
.section--why { background:#fff; }
.section--why .section-head { margin-bottom:24px; }
.why-text-list { max-width:900px; border-top:1px solid var(--line); }
.why-text-row { padding:21px 0 23px; border-bottom:1px solid var(--line); }
.why-text-row h3 { font-size:1.08rem; font-weight:800; margin:0 0 7px; color:var(--ink); }
.why-text-row p { color:var(--muted); font-size:1rem; line-height:1.72; margin:0; }
@media(max-width:600px) {
  .why-text-row { padding:18px 0 20px; }
  .why-text-row h3 { font-size:1.05rem; }
}


/* v19: remove the homepage hero overlay and use Emir's portrait in the Home page About section. */
.hero::before{background:none !important;content:none !important}
.frame-art--portrait{min-height:394px;background:#f3f3f1;border-radius:8px;overflow:hidden}
.frame-art--portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.frame-art--portrait .art-label{display:none}
@media(max-width:720px){.frame-art--portrait{min-height:360px}}


/* v20: lighter hero overlay, portrait image keeps its natural proportions, and header tools precede the phone button. */
.hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(90deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,.40) 50%,rgba(255,255,255,.14) 100%) !important;
  z-index:-1 !important;
}
.frame-art--portrait{
  min-height:0 !important;
  background:transparent !important;
  border-radius:0 !important;
  overflow:visible !important;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.frame-art--portrait img{
  position:static !important;
  inset:auto !important;
  display:block;
  width:min(100%,288px) !important;
  height:auto !important;
  max-width:100%;
  object-fit:contain !important;
  margin:0 auto;
  border-radius:6px;
}
@media(max-width:720px){
  .hero::before{background:linear-gradient(180deg,rgba(255,255,255,.56),rgba(255,255,255,.72) 78%) !important}
  .frame-art--portrait img{width:min(100%,260px) !important}
}


/* v21: refresh the homepage “Zašto izabrati nas?” section with a softer background and small red circle markers like the O Nama fact list. */
.section--why{
  background:var(--paper);
}
.section--why .container{
  position:relative;
}
.section--why .why-text-list{
  max-width:920px;
  background:rgba(255,255,255,.72);
  border:1px solid #ece9e6;
  border-radius:10px;
  padding:10px 26px;
}
.section--why .why-text-row{
  padding:22px 0 23px;
}
.section--why .why-text-row h3{
  position:relative;
  padding-left:22px;
  margin:0 0 8px;
}
.section--why .why-text-row h3::before{
  content:"";
  position:absolute;
  left:0;
  top:.48em;
  width:8px;
  height:8px;
  border:2px solid var(--red);
  border-radius:50%;
  transform:translateY(-50%);
}
.section--why .why-text-row p{
  padding-left:22px;
}
@media(max-width:600px){
  .section--why .why-text-list{padding:6px 18px}
  .section--why .why-text-row h3,
  .section--why .why-text-row p{padding-left:18px}
  .section--why .why-text-row h3::before{width:7px;height:7px;top:.5em}
}


/* v22: alternate the backgrounds of the two editorial sections, with a quiet red accent behind Emir's portrait. */
.architectural-panel{background:#fff}
.architectural-panel::after{content:none}
.section--why{background:#f3f3f2}
.section--why .why-text-list{background:transparent;border:0;border-top:1px solid #dedede;border-radius:0;padding:0;max-width:920px}
.section--why .why-text-row{border-bottom:1px solid #dedede}
.frame-art--portrait img{
  box-shadow:9px 9px 0 rgba(232,76,81,.17), 0 7px 22px rgba(25,25,25,.07);
}
@media(max-width:720px){
  .frame-art--portrait img{box-shadow:7px 7px 0 rgba(232,76,81,.16), 0 6px 18px rgba(25,25,25,.055)}
}


/* v23: actual home section order is Why Choose Us, then Our Approach.
   Why is white; Approach follows on a soft gray background. */
.section--why { background:#fff; }
.section--why .why-text-list { border-color:#e4e4e4; }
.section--why .why-text-row { border-color:#e4e4e4; }
.architectural-panel { background:#f3f3f2; }
.architectural-panel::after { content:none; }

/* Slightly stronger than v20's soft overlay, less washed out than the original hero. */
.hero::before {
  content:"" !important;
  background:linear-gradient(90deg,
    rgba(255,255,255,.73) 0%,
    rgba(255,255,255,.51) 50%,
    rgba(255,255,255,.22) 100%) !important;
}
@media(max-width:720px) {
  .hero::before { background:linear-gradient(180deg,
    rgba(255,255,255,.66) 0%,
    rgba(255,255,255,.78) 85%) !important; }
}


/* v24: Home page About section uses Emir's portrait on the left, with text on the right and the accent shadow moved to the outside edge. */
.split--about{
  align-items:start;
}
.split--about .frame-art--portrait{
  justify-content:flex-start;
  padding-bottom:18px;
}
.split--about .frame-art--portrait img{
  margin:0;
  box-shadow:-10px 10px 0 rgba(232,76,81,.18), 0 8px 20px rgba(25,25,25,.06) !important;
}
.split--about > div:last-child{
  padding-top:6px;
}
@media(max-width:720px){
  .split--about .frame-art--portrait{
    justify-content:center;
    padding-bottom:0;
  }
  .split--about .frame-art--portrait img{
    margin:0 auto;
    box-shadow:-8px 8px 0 rgba(232,76,81,.16), 0 8px 18px rgba(25,25,25,.06) !important;
  }
  .split--about > div:last-child{padding-top:0}
}


/* v25: the About portrait occupies only its own natural-width column;
   the descriptive text gets the remaining width instead of a 50/50 split. */
@media (min-width:721px) {
  .split--about {
    grid-template-columns:minmax(0, clamp(210px, 26vw, 320px)) minmax(0, 1fr);
    column-gap:clamp(40px, 5vw, 80px);
    align-items:center;
  }
  .split--about .frame-art--portrait {
    align-self:center;
    justify-content:flex-start;
    padding-bottom:0;
  }
  .split--about .frame-art--portrait img {
    width:min(100%, 320px) !important;
    max-width:100%;
    height:auto !important;
    object-fit:contain !important;
  }
  .split--about > div:last-child {
    padding-top:0;
    min-width:0;
  }
}
@media (max-width:720px) {
  .split--about {
    grid-template-columns:minmax(0, 1fr);
    row-gap:32px;
  }
}