/* ==========================================================
   SEA LICENSING — ADDITIONAL FLAG STATES
   Compact multi-registry page
   Isolated .ofs namespace only
   ========================================================== */

.ofs{
  --navy:#082d45;
  --navy2:#104c68;
  --blue:#168dbb;
  --cyan:#45b9df;
  --cyan2:#8cdef3;
  --ink:#102f42;
  --muted:#607986;
  --line:#d6e7ee;
  --pale:#f2f9fc;

  overflow:hidden;

  background:
    linear-gradient(
      135deg,
      rgba(25,151,198,.027) 25%,
      transparent 25%
    ) 0 0/42px 42px,
    #fff;
}

.ofs-shell{
  width:min(1240px,calc(100% - 48px));
  margin:auto;
}


/* ==========================================================
   HERO
   ========================================================== */

.ofs-hero{
  position:relative;

  padding:92px 0 82px;

  overflow:hidden;

  color:#fff;

  background:
    radial-gradient(
      circle at 82% 12%,
      rgba(75,190,228,.24),
      transparent 29%
    ),
    linear-gradient(
      135deg,
      rgba(255,255,255,.025) 0 1px,
      transparent 1px 36px
    ),
    linear-gradient(
      120deg,
      #06293f 0%,
      #0a405d 52%,
      #126b8e 100%
    );

  background-size:
    auto,
    36px 36px,
    auto;
}

.ofs-hero::after{
  content:"";

  position:absolute;
  right:-130px;
  top:-180px;

  width:620px;
  height:620px;

  border-radius:50%;

  border:
    1px solid rgba(121,220,247,.13);

  box-shadow:
    0 0 0 65px rgba(121,220,247,.025),
    0 0 0 130px rgba(121,220,247,.018);

  pointer-events:none;
}

.ofs-hero-grid{
  position:relative;
  z-index:2;

  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(390px,.72fr);

  gap:70px;

  align-items:center;
}

.ofs-kicker{
  display:block;

  margin-bottom:11px;

  color:#72d2ef;

  font-size:9px;
  line-height:1;
  font-weight:850;

  letter-spacing:.17em;
  text-transform:uppercase;
}

.ofs-hero h1{
  max-width:780px;

  margin:0;

  color:#fff;

  font-size:
    clamp(48px,5.4vw,78px);

  line-height:.98;

  letter-spacing:-.052em;
}

.ofs-hero-copy > p{
  max-width:720px;

  margin:21px 0 0;

  color:
    rgba(230,244,250,.77);

  font-size:14px;
  line-height:1.72;
}

.ofs-hero-actions{
  display:flex;
  flex-wrap:wrap;

  gap:11px;

  margin-top:27px;
}

.ofs-btn{
  position:relative;

  min-height:47px;

  padding:0 19px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  border-radius:8px;

  text-decoration:none;

  font-size:10px;
  font-weight:850;

  transition:
    transform .28s cubic-bezier(.22,1,.36,1),
    background .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.ofs-btn.primary{
  color:#fff;

  background:#24a5d3;

  border:
    1px solid #24a5d3;
}

.ofs-btn.primary:hover{
  transform:translateY(-3px);

  background:
    linear-gradient(
      135deg,
      #087eb9,
      #079fd1 52%,
      #16b6dd
    );

  box-shadow:
    0 10px 24px rgba(5,106,158,.24),
    0 0 0 4px rgba(47,188,225,.08);
}

.ofs-btn.ghost{
  color:#fff;

  border:
    1px solid rgba(255,255,255,.27);

  background:
    rgba(255,255,255,.055);
}

.ofs-btn.ghost:hover{
  transform:translateY(-3px);

  background:
    rgba(255,255,255,.11);
}


/* hero summary */

.ofs-hero-panel{
  padding:24px;

  border-radius:17px;

  border:
    1px solid rgba(255,255,255,.15);

  background:
    linear-gradient(
      145deg,
      rgba(6,35,53,.81),
      rgba(5,29,46,.68)
    );

  box-shadow:
    0 25px 58px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.06);

  backdrop-filter:blur(14px);
}

.ofs-hero-panel > span{
  color:#75d2ef;

  font-size:8px;
  font-weight:850;

  letter-spacing:.15em;
  text-transform:uppercase;
}

.ofs-hero-panel h2,
.ofs-hero-panel h3{
  margin:6px 0 17px;

  color:#fff;

  font-size:21px;
}

.ofs-hero-stat{
  padding:11px 0;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:15px;

  border-top:
    1px solid rgba(255,255,255,.10);
}

.ofs-hero-stat b{
  color:#fff;

  font-size:11px;
}

.ofs-hero-stat span{
  color:#8cddf3;

  font-size:10px;
  font-weight:850;
}


/* ==========================================================
   DETAILED FLAG LINKS
   ========================================================== */

.ofs-featured{
  padding:37px 0;

  border-bottom:
    1px solid #ddebf1;

  background:#f4fafc;
}

.ofs-featured-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:30px;
}

.ofs-featured-copy span{
  color:#138aba;

  font-size:8px;
  font-weight:850;

  letter-spacing:.13em;
  text-transform:uppercase;
}

.ofs-featured-copy strong{
  display:block;

  margin-top:5px;

  color:#19394b;

  font-size:14px;
}

.ofs-featured-links{
  display:flex;
  flex-wrap:wrap;

  justify-content:flex-end;

  gap:7px;
}

.ofs-featured-links a{
  padding:9px 12px;

  border-radius:7px;

  border:
    1px solid #cce3ed;

  color:#245268;

  background:#fff;

  text-decoration:none;

  font-size:9px;
  font-weight:800;

  transition:.2s ease;
}

.ofs-featured-links a:hover{
  color:#fff;

  background:#164d69;

  border-color:#164d69;

  transform:translateY(-2px);
}


/* ==========================================================
   FLAG INDEX
   ========================================================== */

.ofs-index{
  padding:65px 0 29px;
}

.ofs-head{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);

  gap:50px;

  align-items:end;

  margin-bottom:26px;
}

.ofs-head h2{
  margin:0;

  color:var(--ink);

  font-size:
    clamp(30px,3vw,43px);

  line-height:1.03;

  letter-spacing:-.045em;
}

.ofs-head p{
  margin:0;

  padding-left:18px;

  border-left:
    2px solid #4bb8dd;

  color:var(--muted);

  font-size:11px;
  line-height:1.7;
}


/* filter */

.ofs-filter{
  display:flex;
  flex-wrap:wrap;

  gap:7px;

  padding:11px;

  border-radius:11px;

  border:
    1px solid #d6e8ef;

  background:#fff;

  box-shadow:
    0 8px 24px rgba(16,65,85,.045);
}

.ofs-filter-btn{
  padding:9px 13px;

  border-radius:7px;

  border:
    1px solid transparent;

  background:#f0f7fa;

  color:#335d70;

  cursor:pointer;

  font-size:9px;
  font-weight:800;

  transition:.2s ease;
}

.ofs-filter-btn:hover,
.ofs-filter-btn.active{
  color:#fff;

  background:#133f58;

  border-color:#133f58;

  box-shadow:
    0 6px 14px rgba(11,55,75,.12);
}


/* ==========================================================
   COUNTRY GRID
   ========================================================== */

.ofs-flags{
  padding:18px 0 78px;
}

.ofs-grid{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:13px;
}

.ofs-card{
  position:relative;

  min-height:300px;

  padding:21px;

  display:flex;
  flex-direction:column;

  border-radius:13px;

  border:
    1px solid #d3e6ee;

  background:#fff;

  box-shadow:
    0 8px 25px rgba(17,66,87,.045);

  overflow:hidden;

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.ofs-card::after{
  content:"";

  position:absolute;
  right:-47px;
  top:-53px;

  width:150px;
  height:150px;

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(52,177,219,.085),
      transparent 70%
    );

  pointer-events:none;
}

.ofs-card:hover{
  transform:translateY(-5px);

  border-color:#75c5e1;

  box-shadow:
    0 18px 36px rgba(13,64,86,.12);
}

.ofs-card.is-hidden{
  display:none;
}


/* special current-review card */

.ofs-card.review{
  background:
    linear-gradient(
      145deg,
      #fff,
      #f2f9fc
    );

  border-color:#9bcbdc;
}


/* flag heading */

.ofs-card-head{
  position:relative;
  z-index:2;

  display:grid;

  grid-template-columns:
    48px minmax(0,1fr);

  gap:13px;

  align-items:center;
}

.ofs-flag{
  width:48px;
  height:34px;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  border-radius:5px;

  border:
    1px solid #d4e3e9;

  background:#f4fafc;

  box-shadow:
    0 5px 12px rgba(11,56,76,.06);
}

.ofs-flag img{
  width:100%;
  height:100%;

  object-fit:cover;
}

.ofs-code{
  width:100%;
  height:100%;

  display:grid;
  place-items:center;

  color:#178db8;

  background:#e7f6fb;

  font-size:9px;
  font-weight:900;
}

.ofs-card-title span{
  color:#218fbb;

  font-size:7px;
  font-weight:850;

  letter-spacing:.11em;
  text-transform:uppercase;
}

.ofs-card-title h3{
  margin:4px 0 0;

  color:#14364a;

  font-size:20px;

  line-height:1.05;

  letter-spacing:-.025em;
}


/* chips */

.ofs-chips{
  position:relative;
  z-index:2;

  display:flex;
  flex-wrap:wrap;

  gap:5px;

  margin-top:18px;
}

.ofs-chip{
  padding:5px 7px;

  border-radius:20px;

  color:#197ca4;

  background:#e8f6fb;

  border:
    1px solid #c8e7f2;

  font-size:7px;
  line-height:1;
  font-weight:850;

  letter-spacing:.055em;

  text-transform:uppercase;
}

.ofs-chip.registry{
  color:#365d75;

  background:#eef4f7;

  border-color:#d9e5eb;
}

.ofs-chip.notice{
  color:#77591c;

  background:#fff7dc;

  border-color:#f1df9b;
}


/* body */

.ofs-card > p{
  position:relative;
  z-index:2;

  margin:15px 0 0;

  color:#667f8b;

  font-size:10px;
  line-height:1.55;
}

.ofs-support{
  position:relative;
  z-index:2;

  display:grid;

  gap:6px;

  margin-top:15px;
}

.ofs-support div{
  min-height:31px;

  padding:7px 9px;

  display:grid;

  grid-template-columns:
    18px 1fr;

  gap:7px;

  align-items:center;

  border-radius:7px;

  background:#f5f9fb;

  color:#385767;

  font-size:8.5px;
  line-height:1.35;
}

.ofs-support div::before{
  content:"✓";

  width:18px;
  height:18px;

  display:grid;
  place-items:center;

  border-radius:50%;

  color:#fff;

  background:#2695bd;

  font-size:7px;
  font-weight:900;
}


/* current/country note */

.ofs-note{
  position:relative;
  z-index:2;

  margin-top:11px;

  padding:9px 10px;

  border-left:
    2px solid #52b9db;

  color:#56717e;

  background:#f0f8fb;

  font-size:8px;
  line-height:1.45;
}


/* CTA */

.ofs-card-action{
  position:relative;
  z-index:2;

  margin-top:auto;

  padding-top:17px;

  display:flex;
  justify-content:space-between;
  align-items:center;

  gap:12px;
}

.ofs-card-action small{
  color:#80939c;

  font-size:7.5px;
  line-height:1.35;
}

.ofs-card-action a{
  flex:0 0 auto;

  padding:9px 11px;

  border-radius:7px;

  color:#fff;

  background:#168fbd;

  text-decoration:none;

  font-size:8px;
  font-weight:850;

  transition:.22s ease;
}

.ofs-card-action a:hover{
  transform:translateY(-2px);

  background:
    linear-gradient(
      135deg,
      #087eb9,
      #16b6dd
    );

  box-shadow:
    0 8px 17px rgba(20,135,180,.20);
}


/* ==========================================================
   PREPARE ONCE
   ========================================================== */

.ofs-prepare{
  padding:73px 0;

  color:#fff;

  background:
    radial-gradient(
      circle at 88% 10%,
      rgba(55,183,224,.22),
      transparent 27%
    ),
    linear-gradient(
      145deg,
      #072c42,
      #10516f
    );
}

.ofs-prepare .ofs-head h2{
  color:#fff;
}

.ofs-prepare .ofs-head p{
  color:
    rgba(225,241,247,.70);
}

.ofs-prepare-grid{
  display:grid;

  grid-template-columns:
    repeat(2,1fr);

  gap:13px;
}

.ofs-prep{
  padding:24px;

  border-radius:13px;

  border:
    1px solid rgba(111,211,241,.18);

  background:
    rgba(255,255,255,.055);
}

.ofs-prep > span{
  color:#79d7f1;

  font-size:8px;
  font-weight:850;

  letter-spacing:.12em;
  text-transform:uppercase;
}

.ofs-prep h3{
  margin:6px 0 16px;

  color:#fff;

  font-size:20px;
}

.ofs-prep-list{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:7px;
}

.ofs-prep-list div{
  padding:9px 10px;

  border-radius:7px;

  background:
    rgba(255,255,255,.055);

  color:
    rgba(235,247,250,.82);

  font-size:8.5px;
  line-height:1.4;
}


/* ==========================================================
   PROCESS
   ========================================================== */

.ofs-process{
  padding:69px 0;

  background:#f4fafc;
}

.ofs-process-grid{
  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:10px;
}

.ofs-step{
  padding:20px;

  border-radius:11px;

  border:
    1px solid #d5e7ee;

  background:#fff;
}

.ofs-step-num{
  width:34px;
  height:34px;

  display:grid;
  place-items:center;

  border-radius:50%;

  color:#168eb9;

  background:#e7f6fb;

  font-size:8px;
  font-weight:900;
}

.ofs-step strong{
  display:block;

  margin-top:14px;

  color:#17384b;

  font-size:12px;
}

.ofs-step p{
  margin:6px 0 0;

  color:#6d838d;

  font-size:8.5px;
  line-height:1.5;
}


/* ==========================================================
   FINAL CTA
   ========================================================== */

.ofs-final{
  padding:57px 0;

  background:
    radial-gradient(
      circle at 84% 0%,
      rgba(73,195,233,.22),
      transparent 29%
    ),
    linear-gradient(
      120deg,
      #082f47,
      #0c5878
    );
}

.ofs-final-inner{
  display:flex;

  justify-content:space-between;
  align-items:center;

  gap:35px;
}

.ofs-final span{
  color:#72d4ef;

  font-size:8px;
  font-weight:850;

  letter-spacing:.13em;
  text-transform:uppercase;
}

.ofs-final h2{
  margin:6px 0 0;

  color:#fff;

  font-size:28px;
  letter-spacing:-.035em;
}

.ofs-final p{
  margin:6px 0 0;

  color:
    rgba(230,245,250,.70);

  font-size:9px;
}

.ofs-final .ofs-btn{
  flex:0 0 auto;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media(max-width:1050px){

  .ofs-hero-grid{
    grid-template-columns:1fr;
  }

  .ofs-hero-panel{
    max-width:700px;
  }

  .ofs-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .ofs-process-grid{
    grid-template-columns:
      repeat(2,1fr);
  }

}


@media(max-width:760px){

  .ofs-shell{
    width:min(100% - 28px,1240px);
  }

  .ofs-hero{
    padding:68px 0 55px;
  }

  .ofs-head{
    grid-template-columns:1fr;
    gap:15px;
  }

  .ofs-featured-inner{
    display:grid;
  }

  .ofs-featured-links{
    justify-content:flex-start;
  }

  .ofs-prepare-grid{
    grid-template-columns:1fr;
  }

  .ofs-final-inner{
    display:grid;
  }

}


@media(max-width:580px){

  .ofs-grid,
  .ofs-process-grid{
    grid-template-columns:1fr;
  }

  .ofs-prep-list{
    grid-template-columns:1fr;
  }

}