@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Thin.ttf') format('truetype');font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-ExtraLight.ttf') format('truetype');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Light.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-ExtraBold.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-ThinItalic.ttf') format('truetype');font-weight:100;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-ExtraLightItalic.ttf') format('truetype');font-weight:200;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-LightItalic.ttf') format('truetype');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-Italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-MediumItalic.ttf') format('truetype');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-SemiBoldItalic.ttf') format('truetype');font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-BoldItalic.ttf') format('truetype');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-ExtraBoldItalic.ttf') format('truetype');font-weight:800;font-style:italic;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/Poppins-BlackItalic.ttf') format('truetype');font-weight:900;font-style:italic;font-display:swap}
:root{
    --text:#0f172a;
    --muted:#475569;
    --border:#e5e7eb;
    --bg:#f1f1f1;
    --bg-soft:#f8fafc;
    --accent:#18457d;
    --accent2:#18355e;
    --accent-soft:#a6d4f1;
    --accent-soft2:#64a6da;
    --ark-color:#fcba53;
    --footer-bg:#d6d6d6; --footer-bottom-bg:#252539; --radius:14px; --header-h:72px;
    --shape-left-top: 15%;   /* cat de mult intra forma in text sus (0%-100%) */
    --shape-right-top: 85%;   /* cat de mult intra forma in text sus (0%-100%) */
    --shape-left-bottom: 0%;/* cat de mult intra forma jos: 70% ~ „coboara” spre dreapta */
    --poly-bg:rgba(0,0,0,0.7);
    --poly-color:#fff;
    --poly-pad:20px;
    --poly-bleed:24px; /* cat sa "iasa" fiecare poligon in exterior (px) */
    --media-width:min(520px, 48vw);
    --media-width-sm:100%;
}
html,body{height:100%}
html{font:16px/1.6 'Poppins', system-ui,-apple-system,'Segoe UI',Roboto,Inter,Arial,sans-serif;}
body{margin:0; color:var(--text); background:var(--bg); font-size:16px; line-height:1.6;}
img{max-width:100%; height:auto; display:block}
h1,h2,h3,h4,h5,h6{margin:0 0 1rem 0; font-weight:600; line-height:1.2}
h1{font-size:30px}
h2{font-size:30px}
h3{font-size:25px}
h4{font-size:1.5rem}
h5{font-size:1.25rem}
h6{font-size:1rem}
p{margin:0 0 1rem 0}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline; color:var(--accent-soft)}
.font-accent{
    color: var(--accent);
}
.font-accent2{
    color: var(--accent2);
}
.font-secondary{
    color: var(--muted);
}
.font-ark{
    color: var(--ark-color);
}
.font-soft{
    color: var(--accent-soft);
}
.font-soft2{
    color: var(--accent-soft2);
}
.font-40px{
    font-size: 40px;
}
.font-25px{
    font-size: 25px;
}
/* Force site container to 1000px on ≥992px */
@media (min-width: 992px){ .container{ max-width: 1000px; } }

.position-relative{
    position: relative;
}


/* === Float + wrap pe diagonala ================================== */
.media-float{
    float: right;              /* esential pt shape-outside */
    width: var(--media-width, min(520px, 48vw));   /* latimea „blocului” flotant */
    /*aspect-ratio: 4 / 3;       !* avem nevoie de dimensiuni pentru shape-outside *!*/
    min-height: 360px;         /* fallback pt browsere fara aspect-ratio */
    background-image: url("https://png.pngtree.com/background/20230526/original/pngtree-business-corporate-office-room-background-image-picture-image_2742469.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;        /* permite overlay/backdrop interne */

    /* Forma reala care „respinge” textul */
    shape-outside: polygon(var(--shape-left-top) 0, 100% 0, 100% 100%, var(--shape-left-bottom) 100%);
    -webkit-shape-outside: polygon(var(--shape-left-top) 0, 100% 0, 100% 100%, var(--shape-left-bottom) 100%);

    /* Taiem vizual imaginea in aceeasi forma (optional dar arata corect) */
    clip-path: polygon(var(--shape-left-top) 0, 100% 0, 100% 100%, var(--shape-left-bottom) 100%);
    /* fara border-radius, cum ai cerut */
    border-radius: 0;
}

/* Spatiere implicita langa imagine (deja ai ms-4 in HTML) */
.media-float { margin-left: 60px; margin-bottom: 0; }

/* Text peste imagine + centrare implicita */
.media-float .overlay-text{
    position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; padding: 12px;
}

/* Varianta desktop ingusta aliniata la dreapta (fosta inline) */
.media-float .overlay-text.overlay-narrow-right,
.media-float .overlay-text.overlay-narrow-right-section{
    align-items: revert;
    justify-content: space-evenly;
    text-align: right;
    color: var(--text);
    font-size: 32px;
    width: 260px;
    margin-left: 178px; /* muta coloana de text spre dreapta imaginii */
    line-height: 1.3;
}

/* Titlu si paragrafe in overlay */
.media-float .overlay-text h2{ margin: 0 0 6px 0; font-size: 40px; }
.media-float .overlay-text p{ margin: 0; }

/* === Responsive: pe ecrane mici anulam efectul pt lizibilitate === */
@media (max-width: 991px){
    .media-float{
        float: none;
        width: var(--media-width-sm, 100%);
        aspect-ratio: auto;
        min-height: 220px;
        shape-outside: none;
        -webkit-shape-outside: none;
        clip-path: none;
        margin: 0;
        height: 240px; /* o inaltime ok pe mobil */
    }
}

/* === Two polygons (side by side) =================================== */
.two-polygons{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: stretch;
    overflow: visible; /* permite margin negative sa "iasa" in exterior */
}
.poly-card{
    position: relative;
    background: var(--poly-bg, rgba(0,0,0,0.7));
    color: var(--poly-color, #fff);
    padding: 0; /* padding applied inside to not interfere with clip-path */
    /* Trapezoid/angled polygon style */
    clip-path: polygon(0 0, 100% 0, var(--shape-right-top) 100%, 0 100%);
    -webkit-clip-path: polygon(0 0, 100% 0, var(--shape-right-top) 100%, 0 100%);
    overflow: visible;
    min-height: 220px;
    margin-left: 0; /* extinde spre stanga */
    margin-right: -7%;
}
.right.poly-card{
    clip-path:polygon(var(--shape-left-top) 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path:polygon(var(--shape-left-top) 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -7%;
    margin-right: 0;
    text-align: right;
}

.poly-card .poly-inner{
    padding: var(--poly-pad, 20px);
}
.right.poly-card .poly-inner{
    padding-left: var(--shape-left-top);
}
.poly-card .poly-title{ margin: 0 0 8px 0; }

@media (max-width: 991px){
    .two-polygons{ grid-template-columns: 1fr; }
    .poly-card, .right.poly-card{ clip-path: none; -webkit-clip-path: none; border-radius: 0; margin: 0; text-align: left; overflow: hidden; margin-right: 25px;}
}


/* Header */
.site-header{ position:sticky; top:0; z-index:50; background:var(--bg) }
.site-header .nav{ padding: 15px 0; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; font-weight:700; letter-spacing:.02em; }
.brand img{ width:auto; height:80px; padding-left:15px; }
.brand span{ display:inline-block }

.menu{ display:none; align-items:center; gap:24px; text-transform: uppercase; }
.menu a{ text-decoration:none; color:var(--accent); padding:8px 10px; border-radius:10px; }
.menu a:hover{ color: var(--ark-color); }
.menu a.active{ color: var(--ark-color); }
.lang{ margin-left:0; color:var(--accent-soft); font-size:.95rem }
.lang a{ padding: 8px 0; }
.lang a.active, .lang a:hover{ color:var(--accent-soft); }
@media (min-width: 992px){ .menu{ display:flex } }

/* Footer */
.footer-top{ padding:60px 90px 90px 90px }
.footer-middle{ background:var(--footer-bg); padding:60px 0 45px 0; }
.footer-bottom{ background:var(--footer-bottom-bg); padding:12px 0; color:var(--accent-soft); font-size:.9rem; font-size: 12px}
.footer-links { display:flex; justify-content: space-between;}
.footer-links ul{ list-style:none; padding:0; margin:0; display:grid; gap:2px; font-size:16px; text-align:left; }
.footer-links a{ text-decoration:none; color:var(--accent); }
.footer-bottom a{ color:var(--accent-soft); text-decoration:none;}
.footer-bottom a:hover{ text-decoration:underline; }
.btn-circle{ display:flex; align-items:center; justify-content:center; border-radius:50%; background:#add8f1; color:var(--text); text-align:center; width:300px; height:300px; font-weight:600;font-size:21px;position:absolute;right:-30px;top:30px; }

/* Helpers */
.general-bg{
    background: var(--bg);
}
.btn{ display:inline-block; padding:10px 14px; border:1px solid var(--text); border-radius:10px; color:inherit; text-decoration:none }
.btn:hover{ background:var(--bg-soft) }
.btn-primary{ background:var(--text); color:#fff; border-color:var(--text) }
.content-wrap{ padding: 30px 0 50px; }

.text-center{
    text-align: center;
}
.text-dreapta{
    text-align: right;
}
.pb-30px{ padding-bottom: 30px; }
.pt-30px{ padding-top: 30px; }
.pg-30px{ padding: 30px; }
.pg-30px{ padding: 30px; }
.pb-60px{ padding-bottom: 60px; }
.pt-60px{ padding-top: 60px; }
.mt-30px{ margin-top: 30px; }
.mb-30px{ margin-bottom: 30px; }
.mt-60px{ margin-top: 60px; }
.mb-60px{ margin-bottom: 60px; }



/* Mobile navigation (hamburger) */
.hamburger{ display:inline-flex; flex-direction:column; gap:4px; background:none; border:0; padding:10px; cursor:pointer; border-radius:8px; }
.hamburger .bar{ width:26px; height:3px; background:var(--accent); display:block; border-radius:3px; }
@media (min-width: 992px){ .hamburger{ display:none } }

/* Mobile menu container (overlay) */
.mobile-menu{ position:fixed; inset:0; z-index:60; display:block; }
.mobile-menu[hidden]{ display:none; }
.mobile-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,0.4); opacity:0; transition:opacity .2s ease; z-index:-1;}
.mobile-menu.open .mobile-backdrop{ opacity:1; }
.mobile-menu-inner{ position:absolute; top:0; right:0; height:100%; width:min(320px, 86%); background:var(--bg); box-shadow:-2px 0 16px rgba(0,0,0,.15); transform:translateX(100%); transition:transform .25s ease; display:flex; flex-direction:column; padding:20px; gap:16px; overflow-y:auto; -webkit-overflow-scrolling: touch; }
.mobile-menu.open .mobile-menu-inner{ transform:translateX(0); }
.mobile-close{ position:absolute; top:10px; right:10px; background:none; border:0; font-size:34px; line-height:1; cursor:pointer; color:var(--accent); padding:6px; border-radius:8px; }
.mobile-nav{ display:flex; flex-direction:column; gap:10px; margin-top:30px; }
.mobile-nav a{ color:var(--accent); text-decoration:none; padding:10px 8px; border-radius:8px; text-transform:uppercase; }
.mobile-nav a.active{ color:var(--ark-color); }
.mobile-lang{ margin-top:auto; display:flex; align-items:center; gap:10px; color:var(--accent-soft); font-size:1rem; position: relative; top: -30px;}
.mobile-lang a{ color:var(--accent-soft); text-decoration:none; }
.mobile-lang a.active{ color:var(--ark-color); }

@media (min-width: 992px){ .mobile-menu{ display:none !important } }

/* === Mobile refinements ============================================== */
@media (max-width: 991px){

    .font-40px { font-size: 30px; }
    .container  {  max-width: calc(100vw - var(--bs-gutter-x));}
    /* Header/logo */
    .site-header .nav{ padding: 10px 0; }
    .brand img{ height: 56px; padding-left: 8px; }

    /* Float media overlays: override inline styles on small screens */
    .media-header-section .overlay-text,
    .media-section .overlay-text{
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        width: auto !important;
        margin: 0 !important;
        font-size: 22px !important;
        color: var(--text) !important;
    }
    .media-header-section .overlay-text h2,
    .media-section .overlay-text h2{ font-size: 28px !important; }

    /* General spacing */
    .content-wrap{ padding: 20px 0 40px; }

    /* Footer layout */
    .footer-top{ padding: 30px 20px 50px 20px;}
    .footer-middle{ padding: 30px 0; }
    .footer-links{ flex-wrap: wrap; gap: 16px 32px; justify-content: center; }
    .footer-links ul{ text-align: center; }
    .footer-bottom .footer-links{ justify-content: center; gap: 12px 20px; }

    .footer-top .media-section .position-relative{
        width: 100% !important;
    }
    .footer-top .media-section .position-relative .btn-circle{
        margin-top: -70px;
    }

    /* Big round button adjust */
    .btn-circle{ position: static; width: 220px; height: 220px; margin: 20px auto 0; right: auto; top: auto; font-size: 18px; }
}