/* =========================================================
   SEA LICENSING
   OFFSHORE COMPANIES FORMATION — PREMIUM DESKTOP V1
   ========================================================= */

.oc1-main{
  --navy:#002B49;
  --deep:#052C43;
  --ocean:#004E7C;
  --blue:#0084D1;
  --cyan:#50CAF7;
  --pale:#F4F8FB;
  --text:#10364D;
  --muted:#5E7889;

  background:#fff;
  color:var(--text);
  overflow:hidden;
}

.oc1-main *,
.oc1-main *::before,
.oc1-main *::after{
  box-sizing:border-box;
}

.oc1-shell{
  width:min(calc(100% - 96px),var(--shell,1440px));
  margin-inline:auto;
}

.oc1-eyebrow{
  display:block;
  margin:0 0 14px;
  color:var(--blue);
  font-size:10px;
  line-height:1;
  font-weight:850;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.oc1-title{
  margin:0;
  color:var(--deep);
  font-size:43px;
  line-height:1.03;
  font-weight:800;
  letter-spacing:-.045em;
}

.oc1-rule{
  display:block;
  width:48px;
  height:2px;
  margin-top:18px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));
}


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

.oc1-hero{
  position:relative;
  min-height:570px;
  display:flex;
  align-items:center;
  isolation:isolate;
  background:#032338;
}

.oc1-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;

  background:
    linear-gradient(
      90deg,
      rgba(2,29,47,.98) 0%,
      rgba(2,34,54,.92) 30%,
      rgba(2,37,57,.66) 53%,
      rgba(2,31,48,.26) 77%,
      rgba(2,28,43,.09) 100%
    ),
    url("/assets/images/sections/shipowners-managers-business.webp")
    center center / cover no-repeat;
}

.oc1-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;

  background:
    linear-gradient(
      180deg,
      rgba(0,43,73,.02),
      transparent 56%,
      rgba(0,20,34,.35)
    );
}

.oc1-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
  gap:90px;
  align-items:center;
  padding:48px 0;
}

.oc1-hero-copy{
  max-width:780px;
}

.oc1-hero .oc1-eyebrow{
  color:#6CD0F8;
  margin-bottom:18px;
}

.oc1-hero h1{
  max-width:780px;
  margin:0;
  color:#fff;
  font-size:62px;
  line-height:.99;
  font-weight:800;
  letter-spacing:-.055em;
}

.oc1-hero-copy > p{
  max-width:690px;
  margin:24px 0 0;
  color:rgba(255,255,255,.80);
  font-size:15px;
  line-height:1.75;
}

.oc1-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:31px;
}

.oc1-btn{
  min-height:45px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 21px;
  border:1px solid transparent;
  border-radius:4px;
  text-decoration:none;
  font-size:10px;
  line-height:1;
  font-weight:850;
  letter-spacing:.04em;
  text-transform:uppercase;
  transition:
    transform .25s ease,
    background-color .25s ease,
    border-color .25s ease;
}

.oc1-btn-primary{
  color:#fff;
  background:var(--blue);
  border-color:var(--blue);
}

.oc1-btn-primary:hover{
  transform:translateY(-1px);
  background:#0395E5;
  border-color:#0395E5;
}

.oc1-btn-ghost{
  color:#fff;
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.34);
  backdrop-filter:blur(7px);
}

.oc1-btn-ghost:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.62);
}

.oc1-hero-panel{
  width:100%;
  max-width:405px;
  justify-self:end;
  padding:29px;

  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;

  background:
    linear-gradient(
      145deg,
      rgba(4,47,73,.78),
      rgba(3,34,54,.52)
    );

  box-shadow:
    0 24px 65px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.06);

  backdrop-filter:blur(12px);
}

.oc1-panel-label{
  display:block;
  color:#68CEF7;
  font-size:9px;
  font-weight:850;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.oc1-hero-panel h2{
  margin:12px 0 0;
  color:#fff;
  font-size:22px;
  line-height:1.16;
  letter-spacing:-.025em;
}

.oc1-hero-panel p{
  margin:11px 0 0;
  color:rgba(255,255,255,.68);
  font-size:11px;
  line-height:1.68;
}

.oc1-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:21px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12);
}

.oc1-meta span{
  display:block;
  margin-bottom:5px;
  color:rgba(255,255,255,.43);
  font-size:8px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.oc1-meta b{
  color:#fff;
  font-size:11px;
  line-height:1.4;
}


/* =========================================================
   APPROACH
   ========================================================= */

.oc1-approach{
  padding:87px 0 86px;
  background:#fff;
}

.oc1-approach-grid{
  display:grid;
  grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);
  gap:104px;
  align-items:center;
}

.oc1-approach-copy{
  max-width:600px;
}

.oc1-approach-copy .oc1-title{
  max-width:585px;
}

.oc1-approach-prose{
  position:relative;
  padding-left:36px;
}

.oc1-approach-prose::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  bottom:3px;
  width:1px;

  background:
    linear-gradient(
      180deg,
      rgba(0,132,209,.07),
      rgba(0,132,209,.52),
      rgba(0,132,209,.07)
    );
}

.oc1-approach-prose p{
  max-width:650px;
  margin:0;
  color:#536E7F;
  font-size:13px;
  line-height:1.82;
}

.oc1-approach-prose p + p{
  margin-top:18px;
}


/* =========================================================
   JURISDICTIONS
   ========================================================= */

.oc1-jurisdictions{
  position:relative;
  padding:83px 0 88px;

  background:
    radial-gradient(circle at 86% 17%,rgba(0,132,209,.11),transparent 30%),
    linear-gradient(135deg,#052E47 0%,#00395B 52%,#042A42 100%);
}

.oc1-jurisdiction-head{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  align-items:center;
  margin-bottom:40px;
}

.oc1-jurisdiction-heading{
  grid-column:1;
}

.oc1-jurisdictions .oc1-eyebrow{
  color:#61CDF7;
}

.oc1-jurisdictions .oc1-title{
  color:#fff;
  font-size:40px;
}

.oc1-jurisdiction-intro{
  position:relative;
  grid-column:2 / 4;
  margin:0;
  padding-left:36px;
  padding-right:40px;

  color:rgba(255,255,255,.78);
  font-size:13px;
  line-height:1.72;
}

.oc1-jurisdiction-intro::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:1px;
  height:50px;
  transform:translateY(-50%);

  background:
    linear-gradient(
      180deg,
      rgba(73,197,247,.10),
      rgba(73,197,247,.78),
      rgba(73,197,247,.10)
    );
}

.oc1-jurisdiction-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.oc1-jurisdiction-card{
  position:relative;
  min-height:210px;
  overflow:hidden;
  isolation:isolate;

  padding:27px;

  border:1px solid rgba(255,255,255,.10);
  border-radius:7px;

  background:
    linear-gradient(
      155deg,
      rgba(255,255,255,.066),
      rgba(255,255,255,.025)
    );

  text-decoration:none;

  transition:
    transform .32s ease,
    border-color .32s ease,
    background .32s ease;
}

.oc1-jurisdiction-card:hover{
  transform:translateY(-3px);
  border-color:rgba(73,197,247,.30);

  background:
    linear-gradient(
      155deg,
      rgba(255,255,255,.085),
      rgba(255,255,255,.032)
    );
}

.oc1-jurisdiction-card > *{
  position:relative;
  z-index:2;
}

.oc1-flag{
  width:48px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:24px;
  overflow:hidden;

  border:1px solid rgba(255,255,255,.17);
  border-radius:3px;

  background:#fff;
  box-shadow:0 5px 16px rgba(0,0,0,.10);
}

.oc1-flag img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.oc1-jurisdiction-no{
  display:block;
  margin-bottom:11px;
  color:#58CDF8;
  font-size:8.5px;
  font-weight:850;
  letter-spacing:.13em;
}

.oc1-jurisdiction-card h3{
  margin:0;
  color:#fff;
  font-size:20px;
  line-height:1.18;
}

.oc1-jurisdiction-card p{
  max-width:330px;
  margin:10px 0 0;
  color:rgba(255,255,255,.62);
  font-size:10.5px;
  line-height:1.65;
}


/* =========================================================
   SERVICE SCOPE
   ========================================================= */

.oc1-scope{
  padding:86px 0 90px;
  background:#fff;
}

.oc1-scope-head{
  max-width:760px;
  margin-bottom:39px;
}

.oc1-scope-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.oc1-scope-card{
  position:relative;
  min-height:250px;
  padding:28px;

  border:1px solid #DCE7ED;
  border-radius:7px;

  background:
    linear-gradient(180deg,#fff,#FAFCFD);

  box-shadow:0 10px 30px rgba(7,48,72,.035);

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

.oc1-scope-card:hover{
  transform:translateY(-3px);
  border-color:#C4DDE9;
  box-shadow:0 17px 40px rgba(7,48,72,.08);
}

.oc1-scope-no{
  display:block;
  margin-bottom:26px;
  color:#0084D1;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.oc1-scope-card h3{
  margin:0;
  color:#092F46;
  font-size:20px;
  line-height:1.18;
  letter-spacing:-.02em;
}

.oc1-scope-card p{
  max-width:330px;
  margin:12px 0 0;
  color:#607887;
  font-size:11px;
  line-height:1.65;
}

.oc1-scope-list{
  margin:19px 0 0;
  padding:0;
  list-style:none;
}

.oc1-scope-list li{
  position:relative;
  padding-left:14px;
  color:#284B60;
  font-size:11px;
  line-height:1.72;
}

.oc1-scope-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#0084D1;
}


/* =========================================================
   START PREPARED
   ========================================================= */

.oc1-prepared{
  padding:86px 0 90px;

  background:
    linear-gradient(180deg,#FBFDFE 0%,#F4F8FB 100%);
}

.oc1-prepared-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:72px;
  align-items:center;
  margin-bottom:38px;
}

.oc1-prepared-copy{
  max-width:610px;
}

.oc1-prepared-copy .oc1-title{
  max-width:620px;
  font-size:41px;
}

.oc1-prepared-description{
  position:relative;
  max-width:610px;
  margin:0;
  padding:2px 34px 2px 36px;

  color:#536F80;
  font-size:13px;
  line-height:1.75;
}

.oc1-prepared-description::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:1px;
  height:48px;
  transform:translateY(-50%);

  background:
    linear-gradient(
      180deg,
      rgba(0,132,209,.08),
      rgba(0,132,209,.55),
      rgba(0,132,209,.08)
    );
}

.oc1-info-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.oc1-info-card{
  position:relative;
  min-height:116px;
  overflow:hidden;
  isolation:isolate;
  padding:22px 23px;

  border:1px solid #DCE7ED;
  border-radius:6px;
  background:#fff;

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

.oc1-info-card > *{
  position:relative;
  z-index:3;
}

.oc1-info-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  opacity:0;

  background:
    radial-gradient(circle at 85% 15%,rgba(0,132,209,.14),transparent 40%),
    linear-gradient(135deg,#0A3554,#002B49);

  transition:opacity .35s ease;
}

.oc1-info-card:hover{
  transform:translateY(-4px);
  border-color:rgba(0,132,209,.28);
  box-shadow:0 18px 40px rgba(0,43,73,.16);
}

.oc1-info-card:hover::before{
  opacity:1;
}

.oc1-info-no{
  display:block;
  margin-bottom:13px;
  color:#0084D1;
  font-size:9px;
  font-weight:850;
  letter-spacing:.12em;
  transition:color .35s ease;
}

.oc1-info-card b{
  display:block;
  max-width:310px;
  color:#113950;
  font-size:13px;
  line-height:1.38;
  transition:color .35s ease;
}

.oc1-info-card:hover .oc1-info-no{
  color:#67D1FA;
}

.oc1-info-card:hover b{
  color:#fff;
}


/* =========================================================
   WORKFLOW
   ========================================================= */

.oc1-workflow{
  padding:86px 0 91px;

  background:
    radial-gradient(circle at 50% 120%,rgba(0,132,209,.14),transparent 37%),
    linear-gradient(135deg,#052D45 0%,#003653 55%,#04283E 100%);
}

.oc1-workflow-head{
  width:100%;
  max-width:900px;
  margin:0 auto 68px;
  text-align:center;
}

.oc1-workflow .oc1-eyebrow{
  color:#61CDF7;
}

.oc1-workflow .oc1-title{
  color:#fff;
  font-size:42px;
}

.oc1-workflow-head p{
  max-width:720px;
  margin:17px auto 0;
  color:rgba(255,255,255,.68);
  font-size:11px;
  line-height:1.7;
}

.oc1-stepper{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  padding-top:44px;
}

.oc1-stepper::before{
  content:"";
  position:absolute;
  left:16.666666%;
  right:16.666666%;
  top:7px;
  height:1px;
  background:rgba(82,194,240,.30);
}

.oc1-stepper::after{
  content:"";
  position:absolute;
  left:16.666666%;
  top:7px;
  width:12%;
  height:1px;

  background:
    linear-gradient(
      90deg,
      rgba(105,211,251,0),
      rgba(132,222,255,.48),
      rgba(224,249,255,.98),
      rgba(132,222,255,.48),
      rgba(105,211,251,0)
    );

  box-shadow:
    0 0 2px rgba(181,236,255,.52),
    0 0 5px rgba(73,197,247,.24);

  animation:oc1WorkflowTravel 5.6s ease-in-out infinite;
}

@keyframes oc1WorkflowTravel{
  0%{
    transform:translateX(-50%);
    opacity:0;
  }

  7%{opacity:.68;}
  14%{opacity:1;}
  86%{opacity:1;}
  94%{opacity:.68;}

  100%{
    transform:translateX(505.555%);
    opacity:0;
  }
}

.oc1-step{
  position:relative;
  padding:9px 32px 0;
  text-align:center;
}

.oc1-step::before{
  content:"";
  position:absolute;
  left:50%;
  top:-44px;
  z-index:5;

  width:15px;
  height:15px;
  transform:translateX(-50%);

  border:3px solid #54CAF7;
  border-radius:50%;
  background:#07304A;

  box-shadow:0 0 0 5px rgba(0,132,209,.12);
}

.oc1-step span{
  display:block;
  margin-bottom:13px;
  color:#58CDF8;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.oc1-step h3{
  margin:0;
  color:#fff;
  font-size:20px;
}

.oc1-step p{
  max-width:285px;
  margin:10px auto 0;
  color:rgba(255,255,255,.64);
  font-size:10.5px;
  line-height:1.65;
}


/* =========================================================
   RELATED
   ========================================================= */

.oc1-related{
  padding:82px 0 84px;

  background:
    radial-gradient(circle at 14% 16%,rgba(0,132,209,.04),transparent 30%),
    linear-gradient(180deg,#FBFDFE 0%,#F4F8FB 100%);
}

.oc1-related-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:60px;
  align-items:end;
  margin-bottom:30px;
}

.oc1-related-head .oc1-title{
  font-size:42px;
}

.oc1-related-all{
  margin-bottom:7px;
  color:#0084D1;
  text-decoration:none;
  font-size:10px;
  font-weight:850;
}

.oc1-related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.oc1-related-card{
  position:relative;
  min-height:220px;
  padding:29px 27px 27px;

  border:1px solid #DBE6EC;
  border-radius:7px;

  background:#fff;
  text-decoration:none;

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

.oc1-related-card:hover{
  transform:translateY(-3px);
  border-color:#C5DDEA;
  box-shadow:0 17px 40px rgba(7,48,72,.07);
}

.oc1-related-card span{
  display:block;
  margin-bottom:31px;
  color:#0084D1;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.oc1-related-card h3{
  margin:0;
  color:#092F46;
  font-size:20px;
  line-height:1.15;
}

.oc1-related-card p{
  max-width:330px;
  margin:11px 0 0;
  padding-bottom:42px;
  color:#627988;
  font-size:11px;
  line-height:1.62;
}

.oc1-related-card b{
  position:absolute;
  left:27px;
  bottom:24px;
  color:#0084D1;
  font-size:9.5px;
  font-weight:850;
}


/* desktop only for now */
@media(max-width:1100px){

  .oc1-shell{
    width:min(calc(100% - 48px),var(--shell,1440px));
  }

  .oc1-hero-grid,
  .oc1-approach-grid,
  .oc1-prepared-head{
    gap:46px;
  }

  .oc1-hero h1{
    font-size:50px;
  }

}


/* ==========================================================
   OFFSHORE COMPANY FORMATION
   SERVICE SCOPE — PHOTOGRAPHIC CARD BACKGROUNDS
   ========================================================== */

@media (min-width:1101px){

  .oc1-main .oc1-scope-card{
    position:relative !important;
    overflow:hidden !important;
    isolation:isolate !important;

    min-height:270px !important;

    background:#fff !important;

    transition:
      transform .38s cubic-bezier(.22,.61,.36,1),
      border-color .38s ease,
      box-shadow .38s ease !important;
  }


  /* Background photo layer */
  .oc1-main .oc1-scope-card::before{
    content:"" !important;

    position:absolute !important;
    inset:0 !important;

    z-index:0 !important;
    pointer-events:none !important;

    background-repeat:no-repeat !important;
    background-size:cover !important;
    background-position:center center !important;

    transform:scale(1.01) !important;

    transition:
      transform .55s cubic-bezier(.22,.61,.36,1),
      filter .45s ease !important;
  }


  /* 01 — Incorporation Assessment */
  .oc1-main .oc1-scope-card:nth-child(1)::before{
    background-image:
      url("/assets/images/services/related/offshore-card-incorporation-assessment.webp") !important;
  }


  /* 02 — Document Preparation */
  .oc1-main .oc1-scope-card:nth-child(2)::before{
    background-image:
      url("/assets/images/services/related/offshore-card-document-preparation.webp") !important;
  }


  /* 03 — Formation Coordination */
  .oc1-main .oc1-scope-card:nth-child(3)::before{
    background-image:
      url("/assets/images/services/related/offshore-card-formation-coordination.webp") !important;
  }


  /* Premium white fade for readable HTML text */
  .oc1-main .oc1-scope-card::after{
    content:"" !important;

    position:absolute !important;
    inset:0 !important;

    z-index:1 !important;
    pointer-events:none !important;

    background:
      linear-gradient(
        90deg,
        rgba(255,255,255,.99) 0%,
        rgba(255,255,255,.97) 35%,
        rgba(255,255,255,.86) 55%,
        rgba(255,255,255,.44) 76%,
        rgba(255,255,255,.10) 100%
      ) !important;
  }


  /* Keep actual card text above image */
  .oc1-main .oc1-scope-card > *{
    position:relative !important;
    z-index:3 !important;
  }


  .oc1-main .oc1-scope-card h3{
    color:#092F46 !important;
  }

  .oc1-main .oc1-scope-card p{
    color:#526E7F !important;
    max-width:305px !important;
  }

  .oc1-main .oc1-scope-list{
    max-width:305px !important;
  }


  /* Elegant hover only — no dark blue overlay */
  .oc1-main .oc1-scope-card:hover{
    transform:translateY(-4px) !important;

    border-color:#BDD9E8 !important;

    box-shadow:
      0 18px 42px rgba(4,43,67,.10),
      0 4px 12px rgba(4,43,67,.04) !important;
  }

  .oc1-main .oc1-scope-card:hover::before{
    transform:scale(1.045) !important;
    filter:saturate(1.04) contrast(1.02) !important;
  }

}


/* ==========================================================
   OFFSHORE COMPANIES — START PREPARED
   ELEGANT MARITIME TEXTURE
   ========================================================== */

.oc1-main .oc1-prepared{
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.oc1-main .oc1-prepared::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .18 !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
  background-position:
    left -40px top 90px,
    right 90px top 80px,
    center bottom 30px !important;
  background-size:
    220px 220px,
    260px 260px,
    420px 420px !important;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 240'><g fill='none' stroke='%2397B7CB' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' opacity='0.55'><circle cx='120' cy='120' r='82'/><circle cx='120' cy='120' r='54'/><path d='M120 32v176M32 120h176'/><path d='M120 120l38-38'/><circle cx='120' cy='120' r='6'/></g></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 260'><g fill='none' stroke='%2397B7CB' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' opacity='0.55'><path d='M130 34v104'/><path d='M102 86h56'/><path d='M130 138l-34 27c-18 14-28 36-28 59h124c0-23-10-45-28-59l-34-27'/><path d='M130 138l34-27'/><path d='M130 138l-34-27'/></g></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 420 420'><g fill='none' stroke='%2397B7CB' stroke-width='1.8' opacity='0.38'><circle cx='210' cy='210' r='150'/><circle cx='210' cy='210' r='110'/><circle cx='210' cy='210' r='70'/><path d='M210 30v360M30 210h360'/><path d='M88 88l244 244M332 88L88 332'/></g></svg>") !important;
}

.oc1-main .oc1-prepared > *{
  position: relative !important;
  z-index: 1 !important;
}

.oc1-main .oc1-prepared-card,
.oc1-main .oc1-requirement-card,
.oc1-main .oc1-prepared .requirements-list > div{
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.oc1-main .oc1-prepared-card::after,
.oc1-main .oc1-requirement-card::after,
.oc1-main .oc1-prepared .requirements-list > div::after{
  content: "" !important;
  position: absolute !important;
  right: 18px !important;
  bottom: 12px !important;
  width: 92px !important;
  height: 92px !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .18 !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* row 1 */
.oc1-main .oc1-prepared .requirements-list > div:nth-child(1)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><path d='M60 16v52'/><path d='M42 42h36'/><path d='M60 68l-20 16c-10 8-16 20-16 34h72c0-14-6-26-16-34L60 68z'/></g></svg>");
}
.oc1-main .oc1-prepared .requirements-list > div:nth-child(2)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><rect x='30' y='20' width='42' height='56' rx='6'/><path d='M42 36h18M42 48h18M42 60h12'/><circle cx='82' cy='72' r='14'/><path d='M76 72l4 4 8-10'/></g></svg>");
}
.oc1-main .oc1-prepared .requirements-list > div:nth-child(3)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><circle cx='60' cy='50' r='24'/><path d='M60 26v48M36 50h48'/><path d='M60 74c18 0 30 12 34 26H26c4-14 16-26 34-26z'/></g></svg>");
}

/* row 2 */
.oc1-main .oc1-prepared .requirements-list > div:nth-child(4)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><path d='M60 20c18 0 32 14 32 32 0 24-32 48-32 48S28 76 28 52c0-18 14-32 32-32z'/><circle cx='60' cy='52' r='10'/></g></svg>");
}
.oc1-main .oc1-prepared .requirements-list > div:nth-child(5)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><circle cx='60' cy='60' r='28'/><path d='M60 60l0-18'/><path d='M60 60l16 10'/><path d='M60 16v8M60 96v8M16 60h8M96 60h8'/></g></svg>");
}
.oc1-main .oc1-prepared .requirements-list > div:nth-child(6)::after{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><g fill='none' stroke='%23A8C1D1' stroke-width='2' opacity='0.9'><rect x='38' y='18' width='44' height='64' rx='4'/><path d='M48 34h24M48 46h24M48 58h18'/><path d='M60 82v20'/><path d='M48 96h24'/></g></svg>");
}

/* keep text above texture */
.oc1-main .oc1-prepared .requirements-list > div > *{
  position: relative !important;
  z-index: 1 !important;
}


/* ==========================================================
   OFFSHORE COMPANIES — SERVICE SCOPE
   PREMIUM MARITIME BACKGROUND TEXTURE
   ========================================================== */

@media (min-width:1101px){

  .oc1-main .oc1-scope{
    position:relative !important;
    overflow:hidden !important;
    isolation:isolate !important;

    background:
      radial-gradient(
        circle at 92% 20%,
        rgba(0,132,209,.045) 0%,
        rgba(0,132,209,0) 31%
      ),
      radial-gradient(
        circle at 8% 82%,
        rgba(0,78,124,.035) 0%,
        rgba(0,78,124,0) 29%
      ),
      linear-gradient(
        180deg,
        #FFFFFF 0%,
        #F9FCFE 52%,
        #F5F9FC 100%
      ) !important;
  }


  /* Fine nautical-chart / wave field */
  .oc1-main .oc1-scope::before{
    content:"" !important;

    position:absolute !important;
    inset:0 !important;

    z-index:0 !important;
    pointer-events:none !important;

    opacity:.13 !important;

    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='920' height='260' viewBox='0 0 920 260'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='1'%3E%3Cpath opacity='.26' d='M0 58C92 19 170 99 266 58S446 18 544 58 731 99 920 49'/%3E%3Cpath opacity='.18' d='M0 92C98 52 179 132 276 92s178-38 276 0 190 41 368-9'/%3E%3Cpath opacity='.14' d='M0 130c98-39 182 39 280 0s183-39 282 0 189 39 358 1'/%3E%3Cpath opacity='.10' d='M0 168c95-37 179 38 275 0s182-38 279 0 190 40 366 2'/%3E%3Cpath opacity='.08' d='M0 207c91-35 177 36 268 0s180-36 274 0 188 37 378 0'/%3E%3C/g%3E%3C/svg%3E") !important;

    background-repeat:repeat !important;
    background-size:920px 260px !important;
  }


  /* Large elegant radar / compass geometry */
  .oc1-main .oc1-scope::after{
    content:"" !important;

    position:absolute !important;

    width:620px !important;
    height:620px !important;

    right:-180px !important;
    top:-180px !important;

    z-index:1 !important;
    pointer-events:none !important;

    opacity:.075 !important;

    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 620 620'%3E%3Cg fill='none' stroke='%23004E7C'%3E%3Ccircle cx='310' cy='310' r='250' stroke-width='1.2'/%3E%3Ccircle cx='310' cy='310' r='190' stroke-width='1'/%3E%3Ccircle cx='310' cy='310' r='125' stroke-width='1'/%3E%3Ccircle cx='310' cy='310' r='55' stroke-width='1'/%3E%3Cpath d='M310 38v544M38 310h544M118 118l384 384M502 118L118 502' stroke-width='.8'/%3E%3Cpath d='M310 310L468 180' stroke='%230084D1' stroke-width='2'/%3E%3Ccircle cx='310' cy='310' r='7' fill='%230084D1' stroke='none'/%3E%3C/g%3E%3C/svg%3E")
      center / contain no-repeat !important;
  }


  /* Keep all real section content above texture */
  .oc1-main .oc1-scope > .oc1-shell{
    position:relative !important;
    z-index:3 !important;
  }


  /* slightly cleaner separation around cards */
  .oc1-main .oc1-scope-grid{
    position:relative !important;
    z-index:3 !important;
  }

}

