:root{--deep:#063f52;--dark:#042b38;--green:#00a884;--green2:#18d6ad;--text:#0b3441;--muted:#506b75;--bg:#f6fbfc;--line:#dbeaed;--shadow:0 18px 44px rgba(6,63,82,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);line-height:1.5}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}
.site-header{position:sticky;top:0;z-index:30;background:linear-gradient(90deg,#052d3a,#063f52);color:#fff;box-shadow:0 6px 26px rgba(0,0,0,.14);backdrop-filter:blur(10px)}
.site-header .wrap{width:min(1180px,94%);min-height:86px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:28px;font-weight:900;letter-spacing:-.035em;white-space:nowrap}.nav{display:flex;align-items:center;gap:26px;font-weight:900;font-size:15px;text-transform:uppercase}.nav a{opacity:.96;transition:color .2s ease,opacity .2s ease,transform .2s ease}.nav a:hover{color:var(--green2);opacity:1;transform:translateY(-1px)}.nav a.active{color:var(--green2);border-bottom:2px solid var(--green2);padding-bottom:8px}.reserve-top{background:linear-gradient(135deg,#00a884,#20c997);padding:14px 22px;border-radius:999px;color:#fff!important;box-shadow:0 10px 22px rgba(0,168,132,.22)}
.hero-clean,.video-hero{position:relative;overflow:hidden;color:#fff;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(2,24,33,.94) 0%,rgba(3,36,48,.78) 31%,rgba(3,36,48,.30) 58%,rgba(3,36,48,.08) 100%),url('/images/blog/banner-blog-barramar-v44.jpg');background-position:center center;background-size:cover;background-repeat:no-repeat}.hero-clean::after,.video-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.05) 50%,rgba(0,0,0,.16));pointer-events:none}.hero-clean{min-height:620px}.video-hero{min-height:520px}.hero-clean .inner,.video-hero .inner{position:relative;z-index:1;width:min(1180px,94%);margin:auto;padding:72px 0;animation:heroFade .65s ease both}@keyframes heroFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.eyebrow{color:var(--green2);font-weight:900;font-size:23px;margin-bottom:8px;text-transform:uppercase;letter-spacing:.04em}.hero-clean h1,.video-hero h1{font-size:clamp(48px,7.5vw,96px);line-height:.98;margin:0 0 18px;letter-spacing:-.055em;text-shadow:0 12px 34px rgba(0,0,0,.48)}.hero-clean p,.video-hero p{font-size:clamp(20px,2.1vw,28px);max-width:650px;margin:0 0 28px;text-shadow:0 6px 22px rgba(0,0,0,.50)}.hero-tags{display:flex;gap:18px;flex-wrap:wrap;margin:24px 0 34px;font-weight:900;text-transform:uppercase}.hero-tags span{display:inline-flex;gap:8px;align-items:center;border-right:1px solid rgba(255,255,255,.30);padding-right:18px}.hero-tags span:last-child{border-right:0}.hero-buttons{display:flex;gap:14px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:13px 24px;font-size:15px;font-weight:900;text-transform:uppercase;letter-spacing:.03em;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.btn:hover{transform:translateY(-2px)}.btn.primary{background:linear-gradient(135deg,#00a884,#20c997);color:#fff;box-shadow:0 12px 28px rgba(0,168,132,.25)}.btn.secondary{border:2px solid rgba(24,214,173,.85);color:#fff;background:rgba(0,0,0,.08)}.btn.secondary:hover{background:rgba(0,168,132,.16)}
.container{width:min(1180px,94%);margin:auto}.section{padding:42px 0 68px}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}.section h2{position:relative;font-size:28px;line-height:1.15;margin:0;color:#0b3441;letter-spacing:-.02em}.section h2::before{content:"";display:inline-block;width:4px;height:28px;border-radius:4px;background:var(--green);margin-right:10px;vertical-align:-5px}.section-subtitle{font-size:18px;color:var(--muted);margin:8px 0 0}.all-link{color:#00866d;font-weight:900;text-transform:uppercase;font-size:13px;border:1px solid rgba(0,134,109,.38);border-radius:999px;padding:10px 16px;transition:background .2s ease,transform .2s ease}.all-link:hover{background:rgba(0,168,132,.10);transform:translateY(-1px)}
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{background:#fff;border:1px solid rgba(6,63,82,.08);border-radius:16px;overflow:hidden;box-shadow:0 12px 30px rgba(6,63,82,.10);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:rgba(0,168,132,.22)}.thumb,.video-box{height:175px;background-size:cover;background-position:center;position:relative;transition:transform .35s ease}.video-box{height:auto;aspect-ratio:16/9;border-radius:16px 16px 0 0}.card:hover .thumb,.card:hover .video-box{transform:scale(1.025)}.chip{position:absolute;top:14px;left:14px;background:linear-gradient(135deg,#00a884,#38d9b8);color:#063f52;border-radius:999px;padding:6px 11px;font-size:11px;font-weight:900;text-transform:uppercase;box-shadow:0 8px 18px rgba(0,0,0,.14)}.card-body{position:relative;background:#fff;padding:18px}.card h3{font-size:20px;line-height:1.18;margin:0 0 10px;color:#0b3441;letter-spacing:-.015em}.card p{color:#405963;margin:0 0 18px}.meta{display:flex;align-items:center;justify-content:space-between;gap:14px;color:#47606b;font-size:13px}.read{color:#00866d;font-weight:900;text-transform:uppercase;white-space:nowrap}.footer{background:#052f3d;color:#fff;text-align:center;padding:34px 20px;margin-top:40px;font-weight:700}
@media(max-width:980px){.site-header .wrap{height:auto;padding:18px 0;display:block}.brand{display:block;margin-bottom:14px}.nav{gap:12px;flex-wrap:wrap}.reserve-top{padding:10px 14px}.hero-clean{min-height:560px}.video-hero{min-height:480px}.card-grid,.video-grid{grid-template-columns:1fr 1fr}.hero-tags span{border-right:0}.section-head{display:block}.all-link{display:inline-block;margin-top:14px}.hero-clean,.video-hero{background-position:center center}}
@media(max-width:640px){.site-header .wrap{width:92%;padding:14px 0}.brand{font-size:23px}.nav{font-size:12px;gap:10px}.nav a.active{padding-bottom:4px}.reserve-top{width:100%;text-align:center;margin-top:6px}.hero-clean,.video-hero{min-height:520px;background-position:center center}.hero-clean .inner,.video-hero .inner{padding:52px 0}.eyebrow{font-size:18px}.hero-clean h1,.video-hero h1{font-size:46px}.hero-clean p,.video-hero p{font-size:19px}.hero-tags{gap:10px;margin:20px 0 26px}.hero-tags span{font-size:13px;padding-right:0}.btn{padding:11px 16px;font-size:13px}.card-grid,.video-grid{grid-template-columns:1fr}.section{padding:32px 0 54px}.section h2{font-size:24px}.thumb{height:190px}}
